How to get ONLY numeric keyboard in React-Native?

Question

My goal is to get ONLY numeric keyboard without punctuation. number-pad is not working properly on every device and it also allows to enter symbols "-, _." that is not what I want. I noticed that when secureTextEntry is set to true on TextInput the keyboard is just the one I want, but I can't use it like this because my text is getting masked. So I wonder is there a way to use that keyboard without masking the text? Maybe a hack in the native code exists?

The screen of desired keyboard

NUMBER-PAD IS NOT WORKING ON EVERY DEVICE! THIS IS NUMBER-PAD ON HONOR 8X

Answer 1

You can try by doing like this- keyboardType={Platform.OS === 'android' ? "numeric" : "number-pad"} and then in a method call from onChangeText do this:

**const trimNumber = number.replace(/[^0-9]/g, "");

this.setState({ trimNumber });**

and it is the value prop of TextInput

value={this.state.trimNumber}

By this user wont be able to give any punctuation, if any, we are restricting to enter.