vue在外部方法给下拉框赋值后不显示label的解决
作者：煎饼果子就咖啡
这篇文章主要介绍了vue在外部方法给下拉框赋值后不显示label的解决方案,具有很好的参考价值,希望对大家有所帮助,如有错误或未考虑完全的地方,望不吝赐教
vue在外部方法给下拉框赋值后不显示label
遇到一个问题，我在外部方法中给下拉框赋值以后显示的是value值，正常应该显示label
原代码如下
在此处给性别赋值了
现象如下
排查后发现在此处应该是给字符串而不是数字
修改后正常
vue下拉框选中不显示的问题
上图：
说明
纠结的事情就是：这种情况出现了很多次，每次都排查很久。
出现的情况
- 在几级联动需要使用到el-select组件。
- 在添加的时候没有出现这样的问题，但是在修改的时候很容易出现。
特别是讲将 form.a 赋值给form.b这就会出现一种情况，form.a的改变老是影响form.b
对比
错误的代码：
var resp = response.data; this.form = resp; this.form.cityId = resp.cityName; this.form.provinceId = resp.provinceName;
本来的response的data里面有cityId的值和provinceId的值， 但是我们又重新的赋值了一次。
改正之后的代码：
var resp = response.data; // 此处解决选择市之后不展示label的情况 this.form.cityId = resp.cityName; this.form.provinceId = resp.provinceName; this.form.id = resp.id; this.form.bankName = resp.bankName; this.form.branchName = resp.branchName; this.form.branchId = resp.branchId; this.form.bankCode = resp.bankCode;
总结
以上为个人经验，希望能给大家一个参考，也希望大家多多支持脚本之家。