Question

我来自API的数据如下所示，

[
  {
    "id": 1,
    "appName": "string",
    "defaultAction": "string",
    "defaultMessage": "string",
    "rules": [
      {
        "id": 1,
        "version": "string",
        "brand": "string",
        "action": "string",
        "message": "string"
      },
      {
        "id": 2,
        "version": "string",
        "brand": "new brand",
        "action": "string",
        "message": "string"
      }
    ]
  }
]

我试图像下面那样从状态从父数组读取子数组以绑定到表

const { posts } = this.state;
console.log(posts);
   const rule_list = posts.map(rules => {
  console.log(rules);
});

但是我看到它仍然返回完整的数组而不是仅返回子元素。有人可以在这里帮助我。

Answer 1

规则是特定索引处的完整元素，您需要访问要访问的属性，即rules.rules

或者您可以Destructuring_assignment

let data = [ { "id": 1, "appName": "string", "defaultAction": "string", "defaultMessage": "string", "rules": [ { "id": 1, "version": "string", "brand": "string", "action": "string", "message": "string" }, { "id": 2, "version": "string", "brand": "new brand", "action": "string", "message": "string" } ] } ]

const rule_list = data.map(({rules}) => {
  console.log(rules);
});

Answer 2

您需要访问每个帖子项目的rules属性，以获取子rules数组，如下所示。

posts.map((post) => {
   console.log(post.rules);
});

如果您想从所有帖子中组成规则数组，可以按照以下步骤进行操作：

const rule_list = posts.map((post) => {
        let { rules } = post;
        if(rules && rules.length > 0) {
            return rules;
        }
    });
console.log(rule_list);

在React中使用Array.Map（）返回子数组

2 个答案: