javascript - Redux 表单字段级验证在 Edge 中不起作用

Question

我正在使用此路径中的示例代码 https://redux-form.com/6.6.3/examples/fieldlevelvalidation/验证数字输入

const number = value => value && isNaN(Number(value)) ? 'Must be a number' : undefined

它不会阻止我在 Microsoft Edge 中输入非数字字符。我该如何解决这个问题？

Answer 1

type="number" 将输入转换为数字输入字段。在移动设备上，您会得到只有数字的键盘。所以这更多的是浏览器的事情。验证只会阻止提交并在输入错误值时显示错误消息。

如果您想在使用 onKeyPress 事件时执行此操作:

const NumberInput = ()=>{

  const onKeyPress = (e) => {
    if(e.which<48 || e.which>57) {
      e.preventDefault()
    }
  }

  return (
    <input onKeyPress={onKeyPress} />
  )
}

小例子:https://codesandbox.io/s/loving-lichterman-7eel4