使用React Final Form进行自定义验证

Question

我正在尝试添加一些自定义验证，只允许输入框中的数字（amout）。根据{{​​3}}上给出的示例，我尝试添加自定义验证。

const onlyAmount = value => {
  if (!value) return value
  let onlyNums = value.replace(/^\$?([0-9]{1,3},([0-9]{3},)*[0-9]{3}|[0-9]+)(.[0-9][0-9])?$/, '')
  return onlyNums
}

我最终表格的字段就像

<Field
  name="price"
  component="input"
  type="text"
  parse={onlyAmount}
/>

没问题，它不允许我正确添加数字。我阅读了该文档，但无法找到任何帮助解决方案。

反应最终表格：here

任何建议都会非常有用。

Answer 1

只添加type =“number”。键盘不允许除数字以外的其他键盘。

Answer 2

type="hidden"似乎是个错误。这不会导致<input type="hidden"/>吗？

我没有在心理上解析你的正则表达式，但我建议你尝试在你链接的沙箱中测试你的解析函数，看看它为什么不起作用。

Answer 3

这是您的正则表达式。如果添加控制台以打印出您的值，那么您的onlyNum字符串将为空。