vue对select下拉框赋初值后,不能进行选择的问题
Vue使用elementUI的select选择器出现的问题: 初始化赋值后,无法更改label值,数据已经改变,但UI样式为未变原因:由于对此对象做了一些处理(将对象的键全部转换成小写),改变了对象的键和值,但是由于Vue检测不到对象的变化,导致这个问题解决方案:使用Vm.$set方法,详情见api官方文档 具体代码如下:HTML部分<el-form-item...
Vue使用elementUI的select选择器出现的问题:
初始化赋值后,无法更改label值,数据已经改变,但UI样式为未变
原因:由于对此对象做了一些处理(将对象的键全部转换成小写),改变了对象的键和值,但是由于Vue检测不到对象的变化,导致这个问题
解决方案:使用Vm.$set方法,详情见api官方文档
具体代码如下:
HTML部分
<el-form-item label="Server Area" prop="area">
<el-select v-model="reqData.area" placeholder="all">
<el-option v-for="(item,index) in area" :key="index" :value-key="index" :label="item" :value="item">
</el-option>
</el-select>
</el-form-item>
js部分
async getdata() {
let res = await this.$http.get(
`${api.server}?serverid=${this.$route.query.id}`
);
this.reqData = res.Data.status[0];
this.reqData.area="zh"
let data = {};
for (let key in this.reqData) {
this.reqData[key.toLowerCase()] = this.reqData[key];
if(key!="Area"){
delete this.reqData[key];
}
}
this.$set(this.reqData,"area",this.reqData.Area);
delete this.reqData.Area;
},
更多推荐
所有评论(0)