共计 799 个字符,预计需要花费 2 分钟才能阅读完成。
<template>
<div>
<el-button type="success" icon="el-icon-check" circle @click="change"></el-button>
<el-select v-model="value" placeholder="请抉择">
<el-option v-for="item in options" :key="item.value" :label="item.label" :value="item.value"></el-option>
</el-select>
</div>
</template>
<script>
export default {
name: "HelloWorld",
data() {
return {
options: [
{
value: "选项 1",
label: "黄金糕",
},
{
value: "选项 2",
label: "双皮奶",
},
{
value: "选项 3",
label: "蚵仔煎",
},
{
value: "选项 4",
label: "龙须面",
},
{
value: "选项 5",
label: "北京烤鸭",
},
],
value: "",
};
},
methods: {change(){this.value = this.options[4].value;
},
}
};
</script>
<!-- Add "scoped" attribute to limit CSS to this component only -->
<style scoped>
.el-select-dropdown__item.hover {color: #ffcf44;}
</style>
如图,选中第二项
点击按钮,设置 v -model 绑定的 value 为第五项
关上下拉框
聚焦的选项还是旧的选中项;
然而敞开下拉框再次关上之后,聚焦选项就正确了。另外,在关上下拉框的时候点击按钮,下拉框会敞开,再次关上也是正确的后果。
尽管不是什么大问题,然而好膈应啊,怎么解决
正文完