如何展开对象数组中的子数组并删除某些元素的字符串[关闭]

问题描述 投票:0回答:3

我想将数组中的子数组扩展为这样的对象中的新元素

{
  "date": "1/1/2020",
  "points": [
    {
      "location": "pool"
    },
    {
      "location": "garden"
    }
 ]
},
{
  "date": "2/1/2020",
  "points": [
    {
       "location": "school"
    },
    {
       "location": "lake"
    }
  ]
}

成为

{
   "date": "1/1/2020",
   "location": "pool"
},
{
   "date": "",
   "location": "garden"
},
{
   "date": "2/1/2020",
   "location": "school"
},
{
   "date": "",
   "location": "lake"
}

因为我想在vuetify表中显示此数据,并且希望像这样的合并行那样显示

enter image description here

javascript vuetify.js
3个回答
1
投票

尝试一下:

let arr = [{ "date": "1/1/2020", "points": [{ "point_name": "pool" }, { "point_name": "garden" }] }, { "date": "2/1/2020", "points": [{ "point_name": "school" }, { "point_name": "lake" }] }]
let res = [];
for (let i = 0; i < arr.length; i++) {
    for (let j = 0; j < arr[i].points.length; j++) {
        if (j == 0) {
            let obj = {
                date: arr[i].date,
                point_name: arr[i].points[j].point_name
            }
            res.push(obj);
        } else {
            let obj = {
                date: "",
                point_name: arr[i].points[j].point_name
            }
            res.push(obj);

        }
    }
}
console.log(res);

您也可以使用map来做

let arr = [{ "date": "1/1/2020", "points": [{ "point_name": "pool" }, { "point_name": "garden" }] }, { "date": "2/1/2020", "points": [{ "point_name": "school" }, { "point_name": "lake" }] }]
let res = arr.map((v1, i1) => {
    return v1.points.map((v2, i2) => {
        if (i2 == 0) {
            return {
                date: v1.date,
                point_name: v2.point_name
            }
        } else {
            return {
                date: "",
                point_name: v2.point_name
            }
        }
    })
}).flat()
console.log(res);

1
投票
let data = [
    {
        "date": "1/1/2020",
        "points": [
            {
                "point_name": "pool"
            },
            {
                "point_name": "garden"
            }
        ]
    },
    {
        "date": "2/1/2020",
        "points": [
            {
                "point_name": "school"
            },
            {
                "point_name": "lake"
            }
        ]
    }
]
let transformedData = []
data.forEach(item=>{
    transformedData.push({ // For first point_name, include date
        date: item.date,
        point_name: item.points[0].point_name
    });
    for(let i=1;i<item.points.length;i++) // For rest of the point_names, exclude date
        transformedData.push({
            date: '',
            point_name: item.points[i].point_name
        });
})
console.log(transformedData)

输出

[ { date: '1/1/2020', point_name: 'pool' },
  { date: '', point_name: 'garden' },
  { date: '2/1/2020', point_name: 'school' },
  { date: '', point_name: 'lake' } ]

1
投票

您可以使用flatMap遍历数组并展平多维数组。使用map格式化单个对象。

let arr = [{
  "date": "1/1/2020",
  "points": [{
    "point_name": "pool"
  }, {
    "point_name": "garden"
  }]
}, {
  "date": "2/1/2020",
  "points": [{
    "point_name": "school"
  }, {
    "point_name": "lake"
  }]
}];

let result = arr.flatMap(({date,points}) => points.map(({point_name}) => ({date,point_name})));
console.log(result);
© www.soinside.com 2019 - 2024. All rights reserved.