时间戳

首页 > 解决方案 > React Native如何只允许TextInput上的数字？数字只是一个数字键盘

regex - React Native如何只允许TextInput上的数字？数字只是一个数字键盘

问题描述

我想将 6 位数字作为输入进行验证，但我对非数字字符的文本输入有疑问。

首先，我做到了

<TextInput maxLength={6} style={styles.textInput} onChangeText={value => this.onTextChanged(value) }  value={this.state.codeInput} keyboardType='numeric' />

而且我有一个检测非数字字符的功能。

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

在移动设备中，它只打开带有点字符的数字键盘。甚至，用户按下点字符。功能不允许这样做，但我的问题是物理键盘、复制粘贴和在网络浏览器中打开。我可以在网络浏览器中输入任何内容。功能在 PC 网络浏览器中不起作用。

如何在复制粘贴、物理键盘和 PC 网络浏览器时阻止除 0-9 数字之外的所有字符。

标签： regexreact-nativetextinput

解决方案

也许你可以简单地使用这个正则表达式value.replace(/[^0-9]/, '')

如果您还想管理副本和过去，请使用全局标志：
value.replace(/[^0-9]/g, '')

推荐阅读