react-number-format icon indicating copy to clipboard operation
react-number-format copied to clipboard

Invariant Violation: View config getter callback for component `input` must be a function (received `undefined`) React Native Expo

Open art3mHQ opened this issue 1 year ago • 3 comments

Got an error while running on ios React Native (Expo)

 ERROR  Invariant Violation: View config getter callback for component `input` must be a function (received `undefined`). Make sure to start component names with a capital letter.

This error is located at:
    in input (created by NumberFormatBase)
    in NumberFormatBase (created by PatternFormat)
    in PatternFormat (created by PickUpForm)

after trying to use like that

<PatternFormat
    displayType="input"
    format="(###) ###-##-##"
    mask="_"
    onValueChange={(value) => setTel(value.formattedValue)}
    data-cy="phone"
    value={tel}
    placeholder="(099) 000-00-00"
/>

run into this issue only on ios

Chrome web version works fine

art3mHQ avatar Jul 11 '24 08:07 art3mHQ

I faced the same issue on mobile application, and I think it's because displayText="input" tries to render an <input /> element and React Native of course doesn't support this. So I fixed by changing displayText="text" and passed to the react-number-format component a renderText prop to handle an input component to change the value, like this:

  <PatternFormat
       displayType="text"
      format="(###) ###-##-##"
      mask="_"
      onValueChange={(value) => setTel(value.formattedValue)}
      data-cy="phone"
      value={tel}
      placeholder="(099) 000-00-00"
      renderText={(currentValue) => (<TextInput value={currentValue} />)}
  />

Mathitarazonad avatar Jul 15 '24 14:07 Mathitarazonad

Thank you for responce, but i cant manage to make it work like you show, it did not throw an error but did not accept any input and not showing place holder

art3mHQ avatar Jul 19 '24 10:07 art3mHQ

@art3mHQ I found the solution for input on this thread

BhavinPatel04 avatar Dec 25 '24 01:12 BhavinPatel04