element el-cascader设置默认值

Posted 2022-01-20 robinunix

原文：https://www.jianshu.com/p/b690d7fe6ec0

注意两点就行了

<el-form-item label="AP名称">
              <el-cascader
                v-model="ruleForm.ap"
                :options="apOptions"
                change-on-select>
              </el-cascader>
            </el-form-item>

　

apOptions:[
          
            value:‘‘,
            label: ‘全部‘
          
          ,
            value: ‘zhinan‘,
            label: ‘指南‘,
            children: [
              
              value: ‘shejiyuanze‘,
              label: ‘设计原则‘,
              children: [
                value: ‘yizhi‘,
                label: ‘一致‘
              , 
                value: ‘fankui‘,
                label: ‘反馈‘
              , 
                value: ‘xiaolv‘,
                label: ‘效率‘
              , 
                value: ‘kekong‘,
                label: ‘可控‘
              ]
            , 
              value: ‘daohang‘,
              label: ‘导航‘,
              children: [
                value: ‘cexiangdaohang‘,
                label: ‘侧向导航‘
              , 
                value: ‘dingbudaohang‘,
                label: ‘顶部导航‘
              ]
            ]
          
          ]

第一点v-model="ruleForm.ap"绑定得是数组

第二点设置默认值得时候设置得是label对应得value
如上面得数据我想设置默认值是全部 就要如下设置

this.ruleForm.ap = [‘‘]  

因为label对应得value是‘‘

再举个例子想在页面默认显示 指南/设计原则/一致

this.ruleForm.ap = [‘zhinan‘,‘shejiyuanze‘,‘yizhi‘]