我正在尝试对用户输入的值进行一些数学运算

<Form>
    <label htmlFor={`price${props.id}`}>Price</label>
       <Field
          name={`price${props.id}`}
          type="text"
       />
       <ErrorMessage name={`price${props.id}`} />
       <span> </span> //Where I want to display value
      ...


这就是我使用Formik的方式。表单只是嵌套在Formik内部:

<Formik
          initialValues={{
            [`price${props.id}`]: '',
}}

          onSubmit={(values, { setSubmitting }) => {
            setTimeout(() => {
              alert(JSON.stringify(values, null, 2))
              setSubmitting(false)
          }, 400)
}}>
    <Form>
     ....
    </Form>
</Formik>

最佳答案

Formik接受两种类型的孩子:


反应节点
返回React节点的函数


当前,您正在将React节点传递给Formik(#1)。

为了访问values,您需要将子级更改为函数(#2),称为渲染道具。

然后可以像这样访问值:

<Formik
  initialValues={/* ... */}
  onSubmit={/* ... */}
>
  {props => (
    <form>
      {/* here we can access props.values */}
    </form>
  )}
</Formik>


props包含的完整列表可以是found here

关于javascript - 我可以在onSubmit运行之前访问Formik中的值吗?,我们在Stack Overflow上找到一个类似的问题:https://stackoverflow.com/questions/61085777/

10-11 14:16