ElementUI中的el-select中多选回显数据后没法重新选择和更改

场景

ElementUI的el-select怎样实现下拉多选并实现给下拉框赋值和获取值：

https://blog.csdn.net/BADAO_LIUMANG_QIZHI/article/details/107838848

上面已经实现在编辑时给v-model绑定的数组重新赋值，这样多选框能实现回显数据。

但是没法再次对下拉框的内容进行更改，去掉原来的或者勾选新的都不可以。

 

 

注：

博客：
https://blog.csdn.net/badao_liumang_qizhi
关注公众号
霸道的程序猿
获取编程相关电子书、教程推送与免费下载。

实现

原因 下拉框数据是循环别的接口得来的，因为数据层次太多，render函数没有自动更新，需手动强制刷新。

@change="$forceUpdate()"

添加位置如下

              <el-select
                v-model="form.bcArray"
                placeholder="请选择班次"
                multiple
                clearable
                @change="$forceUpdate()"
                :style="{ width: '200px' }"
              >
                <el-option
                  v-for="dict in bcalldata"
                  :key="dict.bcbh"
                  :label="dict.bcmc"
                  :value="dict.bcbh"
                />
              </el-select>

更改之后