React Native - how to key number pad ONLY (without punctuations)

问题

Is there a way to key a numeric keypad without punctuations?

<TextInput keyboardType='numeric' ..... />

if I use secureTextEntry={true}, it gets the right keyboard I want, but the values are replaced with *.

so, this is what im getting:

This is what I want:

回答1:

Did you try number-pad? both number-pad and numeric work for me on iOS.

回答2:

keyboardType={"number-pad"} Works on Android. Note: I am using FormInput from react-native-elements.

回答3:

I had the same problem.

I could solve doing something like this:

keyboardType={Device.isAndroid ? "numeric" : "number-pad"}

and then in a method call from onChangeText doing this:

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

this.setState({
  cleanNumber
});

and it the value prop of TextInput

value={this.state.cleanNumber}

回答4:

React native not provided keyboardType which remove punctuation from keyboard. You need to use regular expression with replace method to remove punctuation from text and set keyboardType = 'numeric'.

Regular Expression

/[- #*;,.<>{}[]\/]/gi

Example code

 onTextChanged(value) {
    // code to remove non-numeric characters from text
    this.setState({ number: value.replace(/[- #*;,.<>\{\}\[\]\\\/]/gi, '') });
  }

Please check snack link

https://snack.expo.io/@vishal7008/1e004c

回答5:

Please try this,

<TextInput 
     keyboardType = 'numeric'/>

来源：https://stackoverflow.com/questions/48798415/react-native-how-to-key-number-pad-only-without-punctuations