后端返回的数据格式是这样的:
//后端返回的数据格式
tableData: [
{
date: '2023年10月1日',
companyName: '数据1',
total: 50,
faultCount: 15,
online: 5,
road: 10,
reason: '原因1'
},
{
date: '2023年10月1日',
companyName: '数据2',
total: 50,
faultCount: 15,
online: 5,
road: 10,
reason: '原因2'
},
{
date: '2023年10月2日',
companyName: '数据1',
total: 50,
faultCount: 15,
online: 5,
road: 10,
reason: '原因1'
},
{
date: '2023年10月2日',
companyName: '数据2',
total: 50,
faultCount: 15,
online: 5,
road: 10,
reason: '原因2'
}
],
前端要把他处理成对象的格式是这样的
'2023年10月1日': [
{
date: '2023年10月1日',
companyName: '数据1',
total: 50,
faultCount: 15,
online: 5,
road: 10
},
{
date: '2023年10月1日',
companyName: '数据2',
total: 50,
faultCount: 15,
online: 5,
road: 10
}
]
之前一直没有多使用过reduce来处理数据,这次才发现了他的好处,处理数据非常简单
reduce的第一个参数是一个回调函数包括我们需要的数据类型的数据和当前数据,第二个参数是我们定义回调函数中第一个参数的数据类型是哪种,下面这个就是定义了一个对象类型的数据,都是我的个人见解,如果大家要了解请移步至官方文档
const result = this.tableData.reduce((acc, cur) => {
const { date, companyName, ...rest } = cur
if (!acc[date]) {
acc[date] = []
}
acc[date].push({ companyName, ...rest })
return acc
}, {})