小编Sol*_*ake的帖子

如何从外部操作更新 Formik 字段

我正在尝试从模式屏幕更新 Formik 字段。模态返回数据并将它们设置到 pageState 中。考虑到我的 Fomik 表单具有“enableReinitialize”,字段更新工作正常。但是,如果表单处于“脏”状态,这意味着表单中的其他一些字段已更新,则此更新字段的过程将不再起作用。该字段本身是一个只读字段,用户填充数据的唯一方法是单击按钮并从模态中选择数据。

有人知道这个问题的解决方法吗?

反应 16.8.6 形式 1.5.8

我的表格摘要:

<Formik
        enableReinitialize={true}
        initialValues={props.quoteData}
        validationSchema={QuoteFormSchema}
        onSubmit={values => {
          props.onSubmit(values);
        }}
      >


{({ values, setFieldValue }) => (

<Label for='customerName'>Customer:</Label>
                  <Field
                    type='text'
                    name='customerName'
                    id='customerName'
                    value={values.customerName}
                    onClick={props.showCustomerModal}
                    onChange={e => {
                      setFieldValue('customerName', e.target.value);
                    }}
                    component={customInputFormModal}
                  />

Run Code Online (Sandbox Code Playgroud)

从模态中选择新数据后,我需要立即更新 Formik 字段。即使表格很脏。

我还尝试了 ComponentDidUpdate() 将数据从状态直接设置到字段。然而,Formik 状态(使用标签)没有显示任何变化......

另外,我试过:

1) 使用 OnChange + setValue。但是,它似乎仅适用于用户输入(启用该字段并允许用户键入一些数据)。直接在现场设置数据不起作用。

2)Formik效应。然而没有任何成功。

formik

20
推荐指数
1
解决办法
2万
查看次数

标签 统计

formik ×1