Question

我使用Axios通过以下方式连接到URL：

getUsers: function() {
    axios.get(urlUsers).then(response => {
        this.lists = response.data
    });

并获取以下数据：

"lists": [
    {

      "name": "Destacados",
      "tags": [
        "Aguila"
      ],
      "isRoot": true,
      "products": [
        {
          "name": "Coors",
          "code": "139017",

然后尝试列出产品。

如何？

Answer 1

您可以使用v-for呈现列表。在您的情况下，您有一个嵌套数组，因此您需要做两次。但是，我认为您应该更改数据元素“列表”并删除所有多余的引号（“”），使它看起来像这样：

lists: [
  {
    name: "Destacados",
    tags: [
      "Aguila",
    ],
    isRoot: true,
    products: [
      {
      name: "Coors",
      code: 139017,
      },
      {
      name: "Bud",
      code: 139019,
      }
    ],
  }
]

然后运行v-for循环：

<template>
  <div v-for="list in lists" :key="list.name">
    <ul v-for="product in list.products :key="product.name">
      <li>{{product.name}}</li>
      <li>{{product.code}}</li>
    </ul>
  </div>
</template>

如何使用axiosjs从这样的数组中获取数据

1 个答案: