element UI checkbox,通过后台传来的数据默认选中
今天写项目时碰到的一个问题,因为后台传来的是字符串,如果使用 checked 属性所需要的值为布尔值,应该也有办法解决,但我没找到,后面通过 v-model绑定后台拿到的数据,来完成的这一点小功能
第一步:<el-checkbox-group>标签上v-model="role.permission"。这里role.permission 为后台拿到的数据,如图:
<el-checkbox-group v-model="role.permission" @change="permissionchange($event)" > <el-checkbox label="read">读</el-checkbox> <el-checkbox label="write">写</el-checkbox> <el-checkbox label="delete">删</el-checkbox> </el-checkbox-group>
这里注意,el-checkbox 里的 label 值要和拿到的数据名称对应
第二步: 把后台拿到的字符串转为数组
role: { roleName: , reMark: , menuIds: , permission: [], },
this.role.permission = res.data.role.permission.split(,)
这时候就是,role.permission 里有什么值,上面和 label 的 el-checkbox 就会被默认选中