在使用Elemen-UI中el-select时
代码如下↓
<!-- selected -->
<el-select
v-if="item.columnType === ‘selected‘"
:key="updates"
v-model="scope.row[Object.keys(item)[0]]"
placeholder="请选择">
<el-option
v-for="v in selectData[Object.keys(item)[0]]"
:key="v.value"
:label="v.name"
:value="v.value">
</el-option>
</el-select>
因为项目需求这是嵌套在表格里的动态渲染的组件,option也是动态的,当<el-option>中的for循环selectData[Object.keys(item)[0]]赋上值之后,点击下拉并不会出现选项
其实已经有值了,但是dom没更新,所以下拉框就没有值
这个时候,我在el-select上加了个key并给个初始值updates,当我给<el-option>中的for循环selectData[Object.keys(item)[0]]赋上值之后,改变updates的值,这时候vue就会去更新dom
this.selectData[item.columnName] = res; // 强制刷新select下拉dom this.updates = this.updates++;
在vue的机制里当key变化时dom会被刷新,问题也就解决了
good!

原文:https://www.cnblogs.com/bobo1/p/13168499.html