如果验证通过，则像普通 HTML 表单一样提交 redux-form 表单，如果没有通过则触摸所有字段

Question

我正在尝试构建一个表单，如果 redux-form 验证通过，它将像任何其他 HTML 表单一样提交。如果验证失败，我希望它触及所有字段并阻止提交。

所以我需要：编写我自己的 onSubmit 函数，如果验证失败，该函数将触及字段。我正在尝试：

此实现：

handleSubmit (event) {
  const {touch, fields} = this.props
  if (!allValid(fields)) {
    event.preventDefault()
    touch(...fields)
  }
}

产生此错误：TypeError: Cannot read property 'indexOf' of undefined 退出对 touch 的调用。我在追踪 touch 的实施过程中究竟是哪里发生了这个错误时遇到了很多麻烦，但这肯定是对 touch 的调用导致的。

如果验证失败，使用内置的 handleSubmit 将获得正确的触摸行为，但如果验证也通过，我无法弄清楚如何让它像普通 HTML 表单一样提交表单不做这样的骇人听闻的事情：

handleSubmit (event) {
  const {touch, fields} = this.props
  if (!allValid(fields)) {
    event.preventDefault()
    this.props.handleSubmit(() => {})()
  }
}

这确实有效，但似乎是一种糟糕的方法。

Answer 1

我相信 touch 需要一个字符串数组而不是一个对象数组。所以你可能想要 touch(...Object.keys(fields)).

如果验证通过，则像普通 HTML 表单一样提交 redux-form 表单，如果没有通过则触摸所有字段

Submitting redux-form form like a normal HTML form if validation passes, touching all fields if not

reactjs

redux

reducers

redux-form