reactjs - reacttoolbox输入组件不验证字符

Question

我正在使用带有 type="tel" 的 React-toolbox 组件输入

你如何防止组件不接受像字母这样的无效字符？

我希望它只接受数字。输入只能是一个有效的电话号码，包括国际格式。

---

这是一个示例代码

<Input type="Type"
    label="Mobile number"
    name="newUserMobileNo"
    value={this.state.newUserMobileNo}
    className="input mobileno"
    onChange={this.newUserMobileNoChanged}
    error={this.state.noNewUserMobileNo}
    theme={theme} />

Answer 1

在 onChange 函数 (newUserMobileNoChanged) 中检查 event.target.value 与数字正则表达式 (/^[0-9\b]+$/)，如果它有效，则 setState 的“newUserMobileNo”否则无效。

<Input type="Type"
    label="Mobile number"
    name="newUserMobileNo"
    value={this.state.newUserMobileNo}
    className="input mobileno"
    onChange={this.newUserMobileNoChanged}
    error={this.state.noNewUserMobileNo}
    theme={theme} />