element-ui之解决select无法回显的问题
makebo · 127浏览 · 发布于2023-04-06
这篇文章主要介绍了element-ui之解决select无法回显的问题,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教
element-ui解决select无法回显
问题描述
给的是value的值,没有正常显示lable中的值,是因为当select中只赋值了value没有赋值lable的值时,系统会默认将value和lable共用。
我们在绑定数值时value=“1” 是绑定的字符串,所以下面重新将value 赋值为2,同时lable也默认成2,就显示了2.
方法:使用**:value=“1”**就可以回显。
<el-select v-model="moreForm.isVip" placeholder="奖励会员" style="width:100%"> <el-option label="普通会员" value="0"></el-option> <el-option label="vip" value="1"></el-option> <el-option label="vvip" value="2"></el-option> </el-select>
getUserInfor(row) { this.moreForm.isVip = row.isVip; },
解决方法
<el-select v-model="moreForm.isVip" placeholder="奖励会员" style="width:100%"> <el-option label="普通会员" :value="0"></el-option> <el-option label="vip" :value="1"></el-option> <el-option label="vvip" :value="2"></el-option> </el-select>
element-ui多个select回显成功,但是选中无反应
在使用el-select 组件出现一个小问题,对成功回显后的数据,再次进行添加,选框中没有更新,但是提交表单,实际数据是更新的。怀疑可能是视图层没有更新,组件化框架类似问题。
原因 下拉框数据是循环别的接口得来的,因为数据层次太多,render函数没有自动更新,需手动强制刷新
解决方案
添加 @change="$forceUpdate()" 强制更新视图
<el-select v-model="form.roleIds" multiple placeholder="请选择" @change="$forceUpdate()"> <el-option v-for="item in roleOptions" :key="item.id" :label="item.roleName" :value="item.id" :disabled="item.status == 1" ></el-option> </el-select>
总结
相关推荐
PHP实现部分字符隐藏
沙雕mars · 1325浏览 · 2019-04-28 09:47:56
Java中ArrayList和LinkedList区别
kenrry1992 · 908浏览 · 2019-05-08 21:14:54
5月语言排行榜:R 跌出前二十,Python 紧咬 C++
manongba · 689浏览 · 2019-05-09 17:27:24
Tomcat 下载及安装配置
manongba · 970浏览 · 2019-05-13 21:03:56
什么是SpringBoot
iamitnan · 1088浏览 · 2019-05-14 22:20:36
分类专栏
最新发布
最热排行
0评论