React Native -如何只输入数字键盘(不带标点符号)

q7solyqu  于 2023-05-18  发布在  React
关注(0)|答案(6)|浏览(219)

有没有一种方法可以在数字键盘上不加标点?

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

如果我使用secureTextEntry={true},它会得到我想要的正确键盘,但是值会被替换为*
这就是我得到的:

这就是我想要的:

t3irkdon

t3irkdon1#

我也有同样的问题。
我可以解决这样的问题:

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

然后在onChangeText的方法调用中执行以下操作:

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

this.setState({
  cleanNumber
});

它是TextInput的值属性

value={this.state.cleanNumber}
yx2lnoni

yx2lnoni2#

keyboardType={“number-pad”}适用于Android。注意:我使用的是react-native-elements中的FormInput。

kd3sttzy

kd3sttzy3#

React native不提供keyboardType,它从键盘上删除标点符号。您需要使用正则表达式和replace方法来删除文本中的标点符号并设置keyboardType = 'numeric'

正则表达式

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

示例代码

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

请检查零食链接
https://snack.expo.io/@vishal7008/numeric-keyboard

9ceoxa92

9ceoxa924#

你试过number-pad吗?number-padnumeric都可以在iOS上使用。

yk9xbfzb

yk9xbfzb6#

对于Android在我的情况下,我防止设置任何特殊的字符与Miguel Cardenas的例子.
下面是我所做的:

const inputRef = useRef(null);
const setRefValue = v => {
      const clean = v.replace(/[^0-9]/g, '');
      inputRef.current.value = clean;
      inputRef.current.setNativeProps({ text: clean });
    }
  };

<TextInput
   ref={inputRef}
   keyboardType={numeric}
   onChangeText={setRefValue}
/>

每次在TextInput中键入常量setRefValue时,都会清除特殊字符。

相关问题