React如何呈现字段数组的映射(对单个表单问题的多个响应)

Question

我试图弄清楚如何在字段数组中使用react钩子表单。我已经使用了表单(这个代码沙箱是im测试更改以完成这项工作的地方：https://codesandbox.io/s/react-hook-form-custom-input-7cdoh)，但现在正在尝试如何呈现数据。

我可以将json数据包记录为：

"ethics": {
      "0": {
        "explain": "df",
        "managementPlan": "sdf"
      },
      "1": {
        "explain": "sdf",
        "managementPlan": ""
      },
      "value": "informedconsent",
      "label": "Informed consent"
    }

然后，在我的显示中，我试图按如下方式遍历每个数组：

{state.data.ethics.each.map(ethics => <Tag color="magenta">{ethics.label}</Tag>)}

这不起作用--错误消息说：

TypeError:无法读取未定义的属性“映射”

我需要做些什么才能显示输出？

Answer 1

如前所述，您有一个道德对象，而不是数组。

 object.keys(state.data.ethics).map(k=>{
      const obj = state.data.ethics[key]; 
    /* your obj will look like below
    {
            "explain": "df",
            "managementPlan": "sdf"
          }
    */

     // Do Whatever you want to do with obj now 
     return (<>
         <div>{obj.explain}</div>
         <div>{obj.managementPlan}</div>
     </>)

    });