使用Formik

Question

我有一个蚂蚁设计modal，其中有一个Formik组件。如何处理form以外的form提交？我想通过模式form按钮提交save。

Answer 1

使用Formik组件时，render方法将接收一组道具。其中之一称为submitForm，您可以调用它来触发form之外的表单提交。

const BasicExample = () => (
  <div>
    <h1>My Form</h1>
    <Formik
      initialValues={{name: "jared"}}
      onSubmit={(values, actions) => {
        setTimeout(() => {
          alert(JSON.stringify(values, null, 2));
          actions.setSubmitting(false);
        }, 1000);
      }}
      render={props => (
        <div>
          <form>
            <input
              type="text"
              onChange={props.handleChange}
              onBlur={props.handleBlur}
              value={props.values.name}
              name="name"
            />
          </form>
          <button onClick={props.submitForm}>Submit from outside the form</button>
        </div>
      )}
    />
  </div>
);