SetValues Formik 函数禁用 Formik HandleSubmit

Question

我有一个可以通过几种不同方式处理提交的表单。差异由值形式的标志管理，可以是 true 或 false。

我遇到了这个非常奇怪的问题，当我使用 Formik setValues() 函数时，表单根本不进入 handleSubmit 函数。它只是停止执行。但是，如果我仅通过 this.props.values.x = ... 设置值 它进入该功能并继续提交表单就好了。

为什么会出现这种情况？

显示代码确实没有意义，因为描述告诉了您一切，但这就是提交处理程序的样子：

确认函数调用提交处理程序，该处理程序设置值，然后尝试调用handleSubmit

        <Confirmation
          items={this.confirmationData()}
          isLoading={this.props.isSubmitting}
          open={isConfirming}
          preapproval={true}
          submitAnother={this.submitAnother}
          onClick={this.submit} //this is the submit handler
          onClose={() => this.setState({ isConfirming: false })}
        />

  submit = () => {
    this.props.setValues({ ...this.props.values, submit: true})
    this.props.handleSubmit()
  }

如果第一行更改为 this.props.values.submit = true，则表单会提交，但是使用 setValues 函数，应用程序在将提交值设置为 true 后停止执行。

Answer 1

问题在于，当您调用 setFieldValue 时，验证标志被设置为 true，因此最简单的解决方案是将第三个参数传递给 setFieldValue 以手动关闭验证：

  submit = () => {
    this.props.setFieldValue('submit', true, false)
    this.props.handleSubmit()
  }