elementui级联选择器回显

 

最近项目遇到下拉多选，包含级联关系子集多选功能。直接上代码

 

html

```

‹el-cascader

      :options="optionsData"

      :change-on-select="false"

      :props="props"

      v-model="values"

›

‹/el-cascader›

 

 

```

 

Js

 

```

data()｛

 return ｛

    values:［］，

    props:｛

      value:"id",

      label:"label",

      children:"cities",

      multiple:true,//是否多选 

    ｝,

    optionsData:［

       ｛id:"1",label:"四川",cities:［

         ｛ id:"1-1",label:"广安",｝］

        ｝,

         ｛

        id:"2",

        label:"四川",

        cities:［

         ｛

           id:"2-1",

           label:"成都",

          ｝

        ］

        ｝

 

    ］

  ｝

｝,

mounted()｛

  //比如打开页面就回显，这里很关键

  //因为级联选择做了多选，返回数组不会显示。所以我们需要返回二维数组形式

this.values=［

     ［"1","1-1"］,［"2","2-1"］

  ］

｝

```