首页 > 其他 > 详细

filter的灵活运用,对数据层级关系的处理 (Cascader 级联选择器的理想数据处理)

时间:2021-02-12 08:10:48      阅读:120      评论:0      收藏:0      [点我收藏+]

运用filter对 Cascader  级联选择器数据的处理:

理想数据类型:

options: [{
value: ‘zhinan‘,
label: ‘指南‘,
children: [{
value: ‘shejiyuanze‘,
label: ‘设计原则‘,
children: [{
value: ‘yizhi‘,
label: ‘一致‘
}, {
value: ‘fankui‘,
label: ‘反馈‘
}]
}]
}]
实际 的数据:
options:[{  value: ‘zhinan‘,
  label: ‘指南‘,
leval: 1 },
{ value: ‘shejiyuanze‘,
label: ‘设计原则‘,
parent:‘zhinan‘;
leval: 2 },
{ value: ‘yizhi‘,
label: ‘一致‘,
parent:‘‘shejiyuanze‘;
leval: 3
}];

数据的处理:
const Data= options.filter(item => item.leval=== 1);
const firstData = options.filter(item => item.leval=== 2);
const secondData = data.filter(item => item.leval=== 3);
Data[0].children = firstData.map(item => {
item.children = secondData.filter(ite => ite.parent === item.value);
return item;
});
console.log(Data)

filter的灵活运用,对数据层级关系的处理 (Cascader 级联选择器的理想数据处理)

原文:https://www.cnblogs.com/media/p/14398302.html

(0)
(0)
   
举报
评论 一句话评论(0
关于我们 - 联系我们 - 留言反馈 - 联系我们:wmxa8@hotmail.com
© 2014 bubuko.com 版权所有
打开技术之扣,分享程序人生!