antd下拉模糊搜索➕enter弹框

背景: 实现能直接输入/模糊搜索(下拉选项)/回车弹窗选择的功能

Html
‘’
<a-select
show-search
:value=“record.filed1”
placeholder=“input search text”
style=“width: 200px”
:default-active-first-option=“false”
:show-arrow=“false”
:filter-option=“false”
:not-found-content=“null”
@search=“handleSearch”
@change=“selectChange(record, ‘filed1’, $event)”
@blur=“selectBlur(record, ‘filed1’)”
@keyup.enter.native=“searchEnter”

<
a-select-option v-for=“d in goodSearchList” :key=“d”>
{{ d }}

Js
export default {
data () {
return {
tempSearch: ‘’,
goodSearchList: [],
record: {
filed1: ‘’
}
}
},
methods: {
handleSearch (value) {
if (value) {
this.tempSearch = value
let list = []
list.push(value + ‘001’)
list.push(value + ‘002’)
this.goodSearchList = list
} else {
this.goodSearchList = []
}
},
selectChange (record, key, value) {
this.tempSearch = ‘’
this.KaTeX parse error: Expected 'EOF', got '}' at position 29: …ey, value) }̲, selectBlu…set(record, key, this.tempSearch)
this.tempSearch = ‘’
}
},
searchEnter () {
// 弹窗
this.$refs.goodsModal.show()
}
}
}