首页 > 解决方案 > “setAllValues”是否只适用于表单的一层嵌套?(默认情况下在 React-form 中)

问题描述

正如我所见,react-form 有一个非常方便的功能,可以将所有数据设置为表单,但只有它不能正常工作,当使用“ setAllValues ”呈现表单时,所有字段都必须填充数据,但这不会发生第二次和下一级嵌套。

仅以我拥有的数据为例:

const FormData = {
  field1: "field_1",
  fieldsGroup1: {
    field2: "field_2",
    field3: "field_3"
  },
  field4: "field_4",
  fieldsGroup2: {
    field5: "field_5",
    fieldsGroup3: {
      field6: "field_6",
      fieldsGroup4: {
        field7: "field_7"
      }
    }
  },
  field8: "field_8"
};

在本主题中,我想确保当前的“setAllValues”默认情况下仅适用于表单的一级嵌套。

我通过以下方式决定了这个问题...我使用两个组件来呈现表单,并将所有数据设置为所有嵌套字段请看一下我的示例(此处-> https://codesandbox.io/s/pjo46r9xnm)明白我的意思。

...一切似乎都运行良好,但专家们有一个问题,是否有另一种方法可以在没有任何其他组件的情况下使用所有嵌套字段填充表单(从状态/存储/使用其他方式设置所有值)并使用只有 API react-form,因为我在 Microsoft 的文档/互联网/gitHub 中没有找到这种情况)/stackoverflow atc。

或者我的方法是实现这种情况的单一方式)

感谢您对我的问题感兴趣。

标签: reactjs

解决方案


您可以尝试以下方法之一:

https://www.npmjs.com/package/deepmerge除了 react-form

或者如果它适合您的需求

https://github.com/erikras/redux-form


推荐阅读