element下el-select复选框回显

el-select复选框多选样式

<el-select  clearable v-model="type" multiple >
                  <el-option
                    v-for="item in options"
                    :key="item.value"
                    :label="item.label"
                    :value="item.value"
                  ></el-option>
                </el-select>

在vue中声明下拉选绑定的数据

export default {
    
    
  name: 'enterpriseLabel',
  data () {
    
    
    return {
    
    
    	type:'',//绑定的数据
      options: [] // 下拉选选择的数据源
    }
  }
}

显示插入到数据库中的el-select多选的数据

 let type = this.enterForm.postclassid.toString().split(',') // 数据库中查询到的复选框存储的值
      let newArray1 = new Array() // 声明数组
      type.forEach(function (item) {
    
     // 遍历获取到的复选框选中值的数组
        let i = Number(item) // 把数组中的字符串转换为数字
        if (newArray1.indexOf(i) === -1) {
    
     // 新数组中不存在则添加到新数组中
          newArray1.push(i)
        }
      })
      this.type = newArray1 // 复选框数据回显绑定数据

おすすめ

転載: blog.csdn.net/Java_Fly1/article/details/108073606