3

题目描述:
数组一:

arr = [
    {categoryid: 1, title: "语言"},
    {categoryid: 2, title: "音乐"}
]

数组二:

brr= [
 {courseid: 1, categoryid: 1, title: "写作入门"},
 {courseid: 2, categoryid: 1, title: "作文进阶"},
 {courseid: 3, categoryid: 2, title: "摇滚乐欣赏"},
 {courseid: 4, categoryid: 2, title: "流行歌曲"}
]

需要做成二级联动的效果
image.png

因为用的iview的框架,需要处理成如下图,Cascader 级联选择的数据结构image.png

let _childer_callback = function(categoryid) {
    let children = [];
    for (let item of brr) {
      if (item.categoryid == categoryid) {
        children.push({
          value: item.courseid,
          label: item.title
        });
      }
    }
    return children;
};
       
let _arrange_data = [];
for (let category of arr) {
    _arrange_data.push({
        value: category.categoryid,
        label: category.title,
        children:_childer_callback(category.categoryid)
        });
}
this.lessonList = _arrange_data;
console.log(this.lessonList);

最后结果:
image.png

拿到了想要的数据结构。


谁抢了我的网名
79 声望5 粉丝