Vue el-select 获取label值
Vue el-select 获取label值在HTML中设置el-select<el-select style="width:80%;" v-model="chVal" placeholder="" @change="chChange"><el-optionv-for="item in chOptions":key="item.id":...
·
Vue el-select 获取label值
在HTML中设置el-select
<el-select style="width:80%;" v-model="chVal" placeholder="" @change="chChange">
<el-option
v-for="item in chOptions"
:key="item.id"
:label="item.chname"
:value="item.chid">
</el-option>
</el-select>
在el-select的值发生变化时,获取选中的item(即obj),chOption–下拉框绑定的数据,item.chid–value绑定的值
// An highlighted block
chChange(val){
var obj = {};
obj = this.chOptions.find(item =>{
return item.chid === val
});
// console.log(obj.chname)
this.editMessage.chname = obj.chname
},
更新一个方法
<el-select style="width:80%;" v-model="chVal" @change="chChange" ref="selectCh">
<el-option
v-for="item in chOptions"
:key="item.id"
:label="item.chname"
:value="item.chid">
</el-option>
</el-select>
select_handler_province() {
// 在数据变化之后等待 Vue 完成更新 DOM ,再执行
Vue.nextTick(() => {
console.log(this.$refs.selectCh.selectedLabel);
console.log(this.$refs.selectCh.selected.label);
});
}
更多推荐
已为社区贡献5条内容
所有评论(0)