在提交表单之前将 Formik 字段数组重置为空数组答案

【问题标题】：Resetting a Formik field array to an empty array prior to form submission在提交表单之前将 Formik 字段数组重置为空数组
【发布时间】：2021-07-12 20:26:14
【问题描述】：

我使用 Formik 作为我的带有 FieldArray 的 React 应用程序的一部分。以 CodeSandbox 中的以下示例为例：https://codesandbox.io/s/3yv7135981?file=/form.js 以及以下值/道具示例：

props = {
  "values": {
    "plantTitle": "Test",
    "streetAddress": "2222",
    "city": {
      "value": "Gainesville",
      "label": "Gainesville"
    },
    "country": {
      "value": "United States of America",
      "label": "United States of America"
    },
    "descr": "rererere",
    "categories": [
      {
        "value": "Skin & Personal Care",
        "label": "Skin & Personal Care",
        "color": "#f47f20"
      }
    ],
    "nodes": [
      {
        "node_label": "municipal",
        "node_categories": [],
        "cost": "11",
        "currencyUnit": "usd",
        "volume": "1",
        "volumeUnit": "gallons",
        "accuracy": "estimated",
        "numFeeds": "",
        "comment": "qaz",
        "fedInto": []
      },
      {
        "node_label": "ground",
        "node_categories": [],
        "cost": "22",
        "currencyUnit": "usd",
        "volume": "33",
        "volumeUnit": "cubic_meters",
        "accuracy": "measured",
        "numFeeds": "",
        "comment": "dsdsds",
        "fedInto": []
      }
    ]
  }

在提交整体表单之前，我将如何单独重置 nodes[] 字段数组，但仍保留上述 plantTitle, streetAddress 等的所有值？

我尝试过setFieldValue(nodes, [])，但无济于事。我基本上只需要将节点重置为空数组并允许用户重新输入。

【问题讨论】：

标签： javascript reactjs forms formik

【解决方案1】：

我已经分叉了您提供的沙盒。你几乎和setFieldValue在一起。你可能只是错过了一些引号 ("nodes")。

onClick={() => setFieldValue("nodes", [])}

Fork of the codesandbox with setFieldValue("nodes", [])

【讨论】：

看起来不错，但只是想检查setFieldValue() 是否在<Formik>.....</Formik> 标签中工作，setFieldValue("nodes", []) 也可以独立使用（即不是我正在寻找的 onClick 事件的一部分在调用它作为条件组件渲染的一部分？
老实说，我没有用过 Formik。但是，只要它位于 <Formik> 标签或 withFormik 内，您就应该能够使用它。即使它不在事件处理程序上。
仅供参考，似乎为了让它工作，它需要成为事件处理程序的一部分，因为它不能作为独立调用工作。现在一切都好。