element树形结构下拉组件组装对应格式数据

element树形结构下拉组件组装对应格式数据

 <el-row>
                <el-col :span="24">
                                 <el-form-item label="购买渠道" prop="treeData" class="grid-content bg-purple">
                                        <el-cascader
                                            v-model="testForm.treeData"
                                            :options="treeDataList"
                                            :props="props"
                                            clearable
                                            style="width:90%"
                                        >
                                        </el-cascader>
                                 </el-form-item>
                     </el-col>
            </el-row>

在created生命周期函数里面模拟设置接口返回的数据格式，并组装成树形下拉组件需要的数据格式

 created(){
            let list=[
                  {CL_NM:'购买渠道',NAME:'直接业务',ORDER_NO:1,VALUE:'001'},
                  {CL_NM:'购买渠道',NAME:'传统销售业务',ORDER_NO:1,VALUE:'001001'},
                  {CL_NM:'购买渠道',NAME:'销售模式',ORDER_NO:1,VALUE:'001001001'},
                  {CL_NM:'购买渠道',NAME:'电话销售业务',ORDER_NO:1,VALUE:'001002001'},
                  {CL_NM:'购买渠道',NAME:'个人代理业务',ORDER_NO:1,VALUE:'002001'},
                  {CL_NM:'购买渠道',NAME:'金融机构代理业务',ORDER_NO:1,VALUE:'002003001'},
                  {CL_NM:'购买渠道',NAME:'邮政代理业务',ORDER_NO:1,VALUE:'002003003001'},
                  {CL_NM:'购买渠道',NAME:'直面柜台',ORDER_NO:2,VALUE:'001001002'},
                  {CL_NM:'购买渠道',NAME:'新渠道直销业务',ORDER_NO:2,VALUE:'001002'},
                  {CL_NM:'购买渠道',NAME:'互联网销售业务',ORDER_NO:1,VALUE:'001002002'},
            ];
            this.treeDataList=this.changeData(list) // 这里使用changeData()这个函数方法对数据进行加工
    },

数据加工对应的方法函数

changeData(list){
                  let lv1list=[];
                  for(let i=0;i<list.length;i++){
                        let lv1=list[i].VALUE.length/3-1;
                        if(!lv1list[lv1]){
                            lv1list[lv1]={}
                        }
                        lv1list[lv1][list[i].VALUE]=({"value":list[i].VALUE,"label":list[i].NAME})
                  }
                  let parmap=null;
                  let submap=null;
                  for(let j=lv1list.length-2;j>=0;j--){  //从倒数第二级开始
                       parmap=lv1list[j]
                       submap=lv1list[j+1]
                       for(let k in parmap){
                             for(let m in submap){
                                     if(m.startsWith(k)){
                                           if(!parmap[k].children){
                                               parmap[k].children=[]
                                           }
                                           parmap[k].children.push(submap[m])
                                     }
                             }
                       }
                  }
                  let result=[]
                  for(let p in lv1list[0]){
                       result.push(lv1list[0][p])
                  }
                  return result
           },

最终数据显示效果