首页 > 解决方案 > 使用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;
      })

数据库

在此处输入图像描述

标签: javascriptphplaravelvue.js

解决方案


正如已经评论的那样,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);


推荐阅读