2当碰到后端数据不符合自己页面展示的格式后,那就需要自己处理了....
例如:我需要页面展示表格的数据是行程列表里的每一项要包含乘客的信息(而这个乘客信息是要一个可展开的子表格),但是后端返回的却是乘客列表里的每一项包含了行程信息。那么这个时候,我就需要自己处理了
在这里我使用了new Map() 对相同行程id的数据进行整合
1> Map.has(key) 是用于检查Map对象中是否存在指定键key的方法
2>Map.get(key) 是获取指定键key对应的值
3>Map.set(key(指定的键名),要存入的值) 将数据存入Map对象中
/**
data=[
{
passenger_id:123456,
flight_id:[4521212,58451212],
no:'452-111000'
},
{
passenger_id:123454,
flight_id:[4521213,58451215],
no:'452-111080'
}
]
*/
//data格式如上
function processFlightData(data: any[]) {
// 使用 Map 来存储每个 flight_id 对应的数据项
let flightMap = new Map();
// 遍历数据数组,根据 flight_id 分组数据
data.forEach((item: any) => {
// 将 flight_id 转换为字符串作为 Map 的键 (flight_id:[xxxxx,xxxxx])
let flightIdKey = item.flight_id.join(",");
//使用Map.has()来判断是否有这个键值
if (flightMap.has(flightIdKey)) {
// 如果 Map 中已存在相同 flightIdKey,则进行合并
//使用Map.get() 来获取键的值
let existingItem = flightMap.get(flightIdKey);
// 检查是否已有相同乘客信息,如果没有则添加,避免重复
let existingPassenger = existingItem.passengers.find(
(p: any) => p.passenger_id === item.passenger_id //匹配乘客id值
);
if (existingPassenger) {
// 如果已有乘客信息,则拼接新的票号,避免覆盖 ()
existingPassenger.ticket_no += "/" + item.no;
} else {
// 否则,添加新的乘客信息
existingItem.passengers.push({
passenger_id: item.passenger_id,
ticket_no: item.no,
});
}
} else {
// 否则,将当前数据项存入 Map Map.set('键名',要存入的对象)
flightMap.set(flightIdKey, {
flight_id: item.flight_id,
passengers: [{ passenger_id: item.passenger_id, ticket_no: item.no }],
});
}
});
// 将 Map 中的值转换为数组返回
return Array.from(flightMap.values());
}