如何将两个数组JSON映射到Vue中的数据

Question

我的JSON数据在一张纸上有两个不同的数组。 我想显示每个“组织页面”，然后每个页面都有来自选择该组织评论的用户的每个评论。

{
ListOrg: {
id: 1613,
name_org: "US company",
rating: 0,
},
Review: [
{
review_id: 3,
org_id: 1613,
user_id: 2,
description: "Very good",
rating: 3,
user: {
id: 2,
  name: "Kunjanaphorn",
  firstname: "Kunjanaphorn",
  lastname: "Boonmak",
  admin: 0,
  email: "Pim@gmail.com",
}
},
{
review_id: 4,
org_id: 1613,
user_id: 3,
description: "Not bad",
rating: 5,
user: {
  id: 3,
  name: "Kan",
  firstname: "Kan",
  lastname: "Tippayamontree",
  admin: 0,
  email: "First@gmail.com",
}
}
]
}

但是我无法将其映射到vue.js中的数据。 我尝试此解决方案，然后它不起作用。

  data() {
    return {
      Listorgs: [],
      Reviews: [],
      Listorg: {
        name_org: "",
        picture: "",
        headerpic: "",
        description: ""
      }

  mounted() {
    axios.get("/api/listorgs/" + this.id).then(response => {
      var listorg = response.data;
      this.Reviews = listorg.Review;
      this.Listorgs = listorg.Listorg;
    });
  }

你能告诉我语法吗

我想要每个数组中的一些属性-> ListOrg数组中的name_org（string），Review数组中的description（string），Review数组中用户数组中的name（string）和firstname（string）在vue页面中显示

Answer 1

我已经帮助您进行了一些更改并使它正常工作，请查看。

https://jsfiddle.net/fLvy3am9/

  var listorg = response.data;
  this.orgData = listorg.ListOrg;
  this.reviews = listorg.Review.map((review) => {
    return {
      name_org: listorg.ListOrg.name_org,
      description: review.description,
      user: review.user
  };
  });

问我有没有问题。