axios Formik -API调用后更新初始值

p5fdfcr1  于 2023-01-20  发布在  iOS
关注(0)|答案(4)|浏览(147)

我根据选择输入的变化从API调用中动态地获取输入,但是当我试图添加到Formik的初始值时,它总是给我一个错误...

Warning: A component is changing an uncontrolled input of type text to be controlled.

如果我把enableReinitialize={true}设为Formik也没用。
但是,如果我从本地JSON或对象生成输入,错误就会消失。
我到底做错了什么...
https://codesandbox.io/s/test-dynamic-inputs-with-formik-xr9qg
表单提交罚款虽然。

tpxzln5u

tpxzln5u1#

最好使用enableReinitialize={true}。这是官方的Formik API。您可以检查this issue

kuhbmx9i

kuhbmx9i2#

如果有人面临同样的问题,我刚刚找到了解决办法...
您必须在TextInput组件内的输入中设置value={field.value || ''}或您正在使用的任何类型才能解决此问题。

yebdmbv4

yebdmbv43#

我有一个复杂的动态表单,也遇到了这个问题。对于将来调试这个问题的人,我有几点建议:
1.设置Field组件的值--就像Ruby上面所做的那样。
1.确保您的Formik组件有一个唯一的标识键。
1.跟踪并调试initialValues,确保所有字段都被考虑在内。您不必像Ruby那样设置字段值--只要initialValues对象考虑所有字段即可。然而,我的表单动态更改了Field组件--Ruby的解决方案是唯一有效的解决方案。
如果你的表单不是动态的--我认为最好在实现Ruby的解决方案之前先检查一下initialValues对象,Formik应该会为你处理这些值--这就是为什么它是一个非常棒的工具。

rxztt3cl

rxztt3cl4#

我已经检查了enableReinitialize={true}。但是它的工作不如预期。所以写了一个useEffect

useEffect(() => {
        formik.setFieldValue('query_string', active?.query);
    }, [active])

成功了!

相关问题