el-select中回显v-model绑定值数据只显示value且option中不存在改value值
如果el-select中的v-model绑定的值在option中不存在,你可以使用filterable属性和自定义的filter-method来实现回显绑定值。以下是一个示例:
<template>
<div>
<el-select v-model="selectedValue" filterable :filter-method="filterMethod">
<el-option v-for="option in options" :key="option.id" :label="option.label" :value="option.value"></el-option>
</el-select>
</div>
</template>
<script>
export default {
data() {
return {
selectedValue: '',
options: [
{ id: 1, label: 'Option 1', value: 'option1' },
{ id: 2, label: 'Option 2', value: 'option2' },
{ id: 3, label: 'Option 3', value: 'option3' }
]
};
},
methods: {
filterMethod(query, option) {
return option.value.indexOf(query) > -1;
}
}
};
</script>
在上面的示例中,我们使用filterable属性来启用搜索过滤功能,并使用filter-method方法来自定义过滤逻辑。当v-model绑定的值在options中不存在时,该值将无法匹配到任何选项,因此不会显示在下拉框中。但是,你仍然可以通过手动输入来回显绑定值
原文地址: https://www.cveoy.top/t/topic/hYTN 著作权归作者所有。请勿转载和采集!