Formik 处理对象数组的状态答案

【问题标题】：Formik handling state with array of objectsFormik 处理对象数组的状态
【发布时间】：2021-10-07 05:08:48
【问题描述】：

我最近在表单中使用 Formik 库，但遇到了问题。我不确定如何处理组件内部对象数组的状态。我知道setValues 和setFieldValue 方法.. 也知道FieldArray 但我的目标是当我单击添加按钮并且我不想渲染它时将newZone 添加到newZones 数组中。我想自定义渲染并将其放在手风琴下。

这里的沙盒：https://codesandbox.io/s/rough-haze-zdlw9?file=/src/App.js

我需要所有自定义处理程序吗？我需要在组件内部使用本地状态，然后使用setFieldValue 来设置状态吗？或者我可以在其中使用FieldArray 而不进行渲染吗？

谢谢

【问题讨论】：

标签： reactjs forms formik

【解决方案1】：

您使用的是 React-Bootstrap 组件而不是 Formik 组件，因此您必须手动将 handleChange 和 value 属性分配给每个输入组件。当用户点击按钮 Add 时，您还必须调用 setFieldValue()。

例子：

https://codesandbox.io/s/quirky-leaf-tr3rv

【讨论】：