15

in react-native, I have: 

Warning: Failed prop type: Invalid prop `value` of type `number` supplied to `TextInput`, expected `string`.

I have a postalCode and it is numeric value.

I have set the keyboardType="numeric" on <TextInput /> but I still have this error on ios/android/web.

How can I fix it?

Dimitri Kopriwa
  • 13,139
  • 27
  • 98
  • 204

3 Answers3

39

Just convert your number to a string

<TextInput value={postalCode.toString()} ...
HermitCrab
  • 3,194
  • 1
  • 11
  • 10
  • that's what I did, and I also convert it back before submitting it. but that's not a valid answer as this is not explaining why this is happening and how to fix this. – Dimitri Kopriwa Apr 13 '20 at 16:35
  • An InputText is always text, but can set the keyboardType to Numeric to prevent the user from typing non numeric characters (on ios and android, this will display a numeric keyboard). But that doesn't change the fact that TextInput is internally text based – HermitCrab Apr 13 '20 at 16:44
  • I'm reading the doc of TextInput and it seems that onChange and onChangeText both return a string, is there any other callback that returns a number? – HermitCrab Apr 13 '20 at 17:13
  • Actually setting your keyboardType to numeric won't prevent you from pasting non numeric characters – HermitCrab Apr 13 '20 at 17:24
6

Changing keyboardType to numeric doesn't make your TextInput to accept only numbers, it only changes the layout of the keyboard on your mobile device. With keyboardType=numeric your keyboard will have only digits to make it easier for user to type numbers, it's a UX thing but it doesn't make your TextInput of type numeric, that's why you're seeing this warning.

rzwnahmd
  • 1,072
  • 4
  • 8
  • make sense. I wasn't sure why at first. But then, I set my Input with ```keyboardType={'number-pad'}``` and get this warning. – Luiey Nov 23 '22 at 08:23
2

I think that the problem is in the onChange callback.

You can call the onChangeText method like that:

onChangeText: (text) => setValue(text)

Hope it works!

Pablo Naveira López
  • 41
  • 4