javascript - 如何在 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 中的数据
解决方案
首先,这不是 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;
});
推荐阅读
- python - pip 无法在 vagrant up 上安装 - VirtualBox/Vagrant/bento/ubuntu-16.04
- hybris - 通过 OpenID IAS 登录后 Hybris Spartacus 无法从后端当前用户访问
- java - 大型流的 Spring 事务回滚卡住
- xaml - (Xamarin.Forms IOS) PDF 图像不显示
- python-3.x - 将垂直和水平条设置为画布
- java - 为什么即使使用 then() 这个 map() 或 flatMap() 也不完成管道?
- python - 对数似然估计的 Python SciPy 最大化提供了不一致的结果
- microservices - 我们如何限制工业微服务端口,它应该只允许云网关?
- javascript - 为高密度移动屏幕更改 CSS 媒体查询
- android - 下载大文件时 Dart/Flutter HTTP 响应不完整