el-select 在输入时无法使用@keyup @keydown,我便使用如下方法:
<el-select v-model='value' allow-create>
<el-option lable='张三' value='1'>张三</el-option>
</el-select>
看el-select组件的源码知道
在输入的时候会给一个叫selectedLabel赋值
所以这就简单了, 首先el-select加一个属性ref=“select” ,这样我们可以用(‘this.¥refs.select.selectedLabel’)获取到输入时的值
这样只需要在输入时强制给value赋值就可以了, (无法使用watch监听this.$refs.select.selectedLabel改变)
代码:
<el-select v-model='value' ref='select' allow-create>
<el-option lable='张三' value='1'>张三</el-option>
</el-select>
<span v-if="this.$refs.select"><!-- 输入时强制赋值 -->
{{changeThis($refs.select.selectedLabel)}}
</span>
changeThis(val) {
if(val != '' && val != undefined) {
this.value = val;
}
return '';
},
可能会碰到强制赋值无法用clearable 清空文本的问题,只需要在el-select 组件上加上,@clear=“方法” 在方法里面清空掉 $refs.select.selectedLabel便可
就这样了,方式之一吧