如何在ReactJS中验证输入type =“ number”？

Question

我在ReactJS应用程序中验证HTML元素输入type =“ number”时遇到问题：

render() {
    return (
        <input type="number" onBlur={this.onBlur} />
    );
},

onBlur(e) {
    console.log(e);
}

日志是：

在桌面应用程序上一切正常，但在移动设备上存在问题。用户可以更改键盘并输入所需的所有内容。因此，我想使用验证对其进行修复。当我尝试捕获用户输入的值时，会收到此日志。就像React只是隐藏了这个不正确的值一样。

我该如何解决？还是有另一种方法如何在ReactJS应用程序中验证输入type =“ number”？

提前致谢。

Answer 1

这是验证的最佳方法：

<input type="number" pattern="[0-9]*" inputmode="numeric">

这样我就无法输入其他内容了。此外，检查null 的e.target.value无法获得良好的固定结果，因为空字段和文本不正确的字段是相同的（空）。