vue.js ruoyi elementui element ui多选框（Checkbox 多选框、Select多选框）编辑时无法选中的解决办法

1. Checkbox 多选框无法选中的解决办法：

在上面添加变更事件，然后变更事件中添加this.$forceUpdate(); 强制渲染多选框的样式即可

checkedBoxChange(){

//console.log("多选框实时变化：" + this.form.reptGroupArray);

this.$forceUpdate(); //强制渲染多选框样式，否则值变了样式没有选中

注意：多选框需要传数组，字符串无法正常渲染，因此表单初始化绑定的v-model需要初始化为空数组[],而编辑页面传值时如果是字符串，需要转数组：

this.form.reptGroupArray = this.form.reptGroup.split(',');

2. Select多选框无法选中的解决办法：

重点就是： this.$forceUpdate(); 强制刷新，多选框的小bug，经常不强制刷新就渲染失败，导致要么无法选中，要么无法取消选中

/** 修改按钮操作 */

handleUpdate(row) {

this.reset(); //初始化表单

getDataById(row.id).then(response => { //后台根据id获取数据

this.form = response.data; //返回的实体赋值给form表单

this.form.releaseType = this.form.remark.split(","); //把字符串根据逗号分割成数组

this.$forceUpdate(); //多选框赋值后，强制刷新多选框，否则多选框无法取消或选中

});

这是我的下拉框定义（使用数据字典作为下拉框选项，后台赋值后多选框自动选中）

精彩文章

评论可见，请评论后查看内容，谢谢！！！

您阅读本篇文章共花了：

金钥匙