问题描述：今天本人在编写前端页面时突然发现引用的element-ui中的el-select选择器无法显示选中内容，但是当我把表单数据全部填写完后打算上交时，el-select选择器的内容又能够出现我首次选择的东西了，但是点击其它无效，不能够切换数据。对数据修改时毫不影响el-select选择器的使用。
问题代码：
<div class="form-group">
<div class="col-sm-2 control-label">职称</div>
<el-select v-model="teachers.jobname" placeholder="请选择">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
var vm = new Vue({
el:'#rrapp',
data:{
showList: true,
title: null,
options: [{
value: '助教',
label: '助教'
}, {
value: '讲师',
label: '讲师'
}, {
value: '副教授',
label: '副教授'
}, {
value: '教授',
label: '教授'
}],
value:''
原因：查看Vue.js官网文档。
image.png
本人理解的是，在首次初始化之后，便不会在进行加载渲染了，需要我们手动去执行渲染方法去重新加载它。
解决方案：使用Vue.js官方提供的vm.$forceUpdate()方法，该方法作用是迫使Vue实例重新渲染。
<div class="form-group">
<div class="col-sm-2 control-label">职称</div>
<el-select v-model="teachers.jobname" placeholder="请选择" @change="$forceUpdate()">
<el-option
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
</el-option>
</el-select>
</div>
————————————————
版权声明：本文为CSDN博主「一条代码鱼」的原创文章，遵循CC 4.0 BY-SA版权协议，转载请附上原文出处链接及本声明。
原文链接：https://blog.csdn.net/fish332/article/details/110280256
