首页 > 解决方案 > 如何在 vue.js 中迭代数据

问题描述

我正在尝试在方法函数内的 vue 上迭代这些数据

{
  "data": [
    {
      "id": 1,
      "name": "Jack Daniels",
      "mobile": "21223",
      "start": "2021-02-25T09:16:21.000000Z",
      "end": "2021-02-25T09:16:21.000000Z"
    }
  ]
}

这是我的代码

async getEvents() {
    try {
        const response = await axios.get('/api/customers')

        Object.entries(response).forEach(([key, value]) => {
            console.log(`${key}:${value}`)
        })

    } catch (err) {
        console.log(err)
    }
}

这是输出

data:[object Object],[object Object]

知道出了什么问题,以及是否有更好的方法来迭代 vue.js 中的数据

标签: javascriptvue.js

解决方案


首先,这不是 Vue 问题(axios/js 标签)。
您在这里不需要 Object.entries(如果您需要迭代数据数组)。
只需将 map 用于数组,仅此而已。

const iteratedData = response.data.map((item, index) => {
    console.log(`Index ${index}`);
    console.log(item);
    // Do what you need with data, your iteration
    return item;
});

推荐阅读