el-cascader 联动回显，传过来的id和循环的id必须一

1.结构，必须绑定v-model，子组件的结构和数据

<div class="selectSectionColumn">
        <el-cascader
                :options="sectionColumns"
                :props="sctColProp"
                clearable
                change-on-select
                placeholder="请选择或者输入版块/栏目"
                v-model="sectionCode"
                @change="handlerValue"
        >

        </el-cascader>

2.js

 export default {
        name: "selectSectionColumn",
        data(){
            return{
                //板块和栏目联动
                sctColProp: {
                    checkStrictly: true,
                    value:'sectionCode',
                    label:'sectionName',
                    children:'sectionColumns'
                },
                sectionColumns:[],//版块/栏目
                sectionCode:[] //绑定数据
            }
        },
        props:{
            sectionCodeAddColumnAdd: {
                type: Object,
                default () {
                    return {}
                }
            }
        },
        created(){
                this.getSectionName();//获取版块栏目联动下拉
        },
        methods: {
            //获取版块栏目联动下拉
            getSectionName(){
                selectSectionColumnApi.getallSectionAndColumnByStatusList().then(res=>{
                    if(res.status===0){
                        this.sectionColumns=res.data||[];
                       //回显
                        if(res.data.length>0){
                            this.sectionCode=[];
                            //编辑回显版块/栏目
                            if(this.$props.sectionCodeAddColumnAdd){
                                for( let i=0; i<res.data.length;i++){
                                    console.log(res.data[i].sectionCode);
                                    console.log(this.$props.sectionCodeAddColumnAdd.belongSectionCode);
                                    setTimeout(()=>{//定时器，为了有时不回显,注意，注意，注意，主要的事情说三遍！！！！
                                            if(res.data[i].sectionCode==this.$props.sectionCodeAddColumnAdd.sectionCode || res.data[i].sectionCode==this.$props.sectionCodeAddColumnAdd.belongSectionCode){//版块
                                                this.sectionCode.push(res.data[i].sectionCode)
                                                if(res.data[i].sectionColumns&&res.data[i].sectionColumns.length>0){
                                                    if(this.$props.sectionCodeAddColumnAdd){
                                                        for (let k=0; k<res.data[i].sectionColumns.length;k++){
                                                            if(this.$props.sectionCodeAddColumnAdd.columnCode==res.data[i].sectionColumns[k].sectionCode||this.$props.sectionCodeAddColumnAdd.belongColumnCode==res.data[i].sectionColumns[k].sectionCode){//栏目
                                                                this.sectionCode.push(res.data[i].sectionColumns[k].sectionCode)
                                                            }
                                                        }
                                                    }
                                                }
                                            }
                                        },0);
                                    }
                                }
                        }
                    }
                }) .catch((error) => {
                    console.log('/sectionColumnMsg/selectAllSectionAndColumn', error)
                });
            },
            handlerValue(value){
                this.$emit('sectionColumnAdd',value)
            }
        }
    }

3.父组件的结构

1.解释
<el-form-item label="所属板块" prop="belongSectionCode">
                  <select-section-column-add  ref="sectionCodeAdd" :sectionCodeAddColumnAdd="ruleForm" //form表单的名字   @sectionColumnAdd="sectionColumnSelectAdd"//(sectionColumnAdd要和子组件传过来的名字一致，可以是驼峰式)></select-section-column-add>
                </el-form-item>
2.正式的结构
 <el-form-item label="所属板块" prop="belongSectionCode">
                  <select-section-column-add  ref="sectionCodeAdd" :sectionCodeAddColumnAdd="ruleForm"    @sectionColumnAdd="sectionColumnSelectAdd"></select-section-column-add>
                </el-form-item>

4.注册组件，引用组件就不说了，子组件传过来的数据

//版块/栏目下拉
          sectionColumnSelectAdd(data){
            if(data){
              if(data.length==1){
                this.ruleForm.belongSectionCode=data[data.length - 1].toString();
              }else{
                this.ruleForm.belongSectionCode=data[0];
                this.ruleForm.belongColumnCode=data[1];
              }
            }else{
              this.ruleForm.belongSectionCode='';
              this.ruleForm.belongColumnCode='';
            }
          },