使用vantdesign的选择器,当输入值以后,鼠标失去焦点,如何让值保留在输入框中
<template>
<a-select
v-model="result"
:show-search="true"
:not-found-content="null"
:filter-option="true"
:allowClear="true"
style="width: 180px"
placeholder="请选择或输入水果"
@search="handleSearch"
@blur="handleBlur"
@change="handleChange"
>
<a-select-option
v-for="(item, index) in list"
:key="index"
:value="item.id"
>
{{ item.val }}
</a-select-option>
</a-select>
</template>
<script>
//导入组合式api
import { ref, reactive, computed } from "vue";
export default {
name: "Child",
//vue3中全新的编程方式:组合式api
setup() {
const list = [
{ id: "1", val: "香蕉" },
{ id: "2", val: "苹果" },
{ id: "3", val: "火龙果" },
];
const result = ref("undefined");
const handleSearch = (value) => {
handleChange(value);
};
const handleChange = (value) => {
result.value = value != null && value != "" ? value : undefined;
console.log(result.value,'ss')
};
const handleBlur = (value) => {
result.value = value;
};
return {
list,
result,
handleBlur,
handleSearch,
handleChange,
};
},
};
</script>