javascript - 使用Vuejs的单个数组元素中的多个字段
问题描述
如何在 Vue 的单个数组元素中从一行中添加两个或三个字段? Vue
Vehicles: [
"BMW 100 1994",
"Audi 300 2001",
"Toyota 200 2000",
"Mazda 104 2011",
"Car 104 2014",
"Car2 140 2015" ]
回复
axios.get('/api/manage/manage/vehicles').then(response => {
this.vehicles = response.data.vehicles;
})
数据库
解决方案
正如已经评论的那样,vue 可以处理数组或任何其他类型的数据。
但是要回答您的问题,假设vehicles
来自服务器的数据是一个对象,例如:
console.log(response.data.vehicles)
[
{id: 1, make: 'BMW', model: '100', year: 1994},
{id: 2, make: 'Audi', model: '1 Series M', year: 1994}
]
要根据您的期望解决此问题,您可以执行以下操作:
axios.get('/api/manage/manage/vehicles').then(response => {
this.vehicles = response.data.vehicles.map(car => `${car.make} ${car.model} ${car.year}`);
})
请参阅上面的代码片段以测试这是如何完成的:
const vehicles = [{
id: 1,
make: 'BMW',
model: '100',
year: 1994
},
{
id: 2,
make: 'Audi',
model: '1 Series M',
year: 1994
}
]
const output = vehicles.map(car => `${car.make} ${car.model} ${car.year}`)
console.log(output);
推荐阅读
- node.js - 节点/角度 CORS 问题
- wpf - 我可以同时拥有代码隐藏 Click 事件和命令吗?
- javascript - Npm 和节点导入
- elixir - 是否可以将 Ueberauth 配置为使用 Github Enterprise 登录?
- python-3.x - 涡轮增压 lambda 函数比较两个数据帧中的值
- javascript - 即使客户端没有提供回调,有没有办法从服务器发送响应?
- javascript - 在下拉菜单上使用锚标记进行页面导航
- javascript - 有没有办法创建一个可以读取它所在目录的模块?(打字稿/JavaScript)
- java - 在静态成员类中展平 JUnit 测试
- ios - 如何在 SwiftUI 中迭代/foreach 数组