var Main = {
data() {
return {
optionsCopy: [{
value: '1',
label: 'meat'
}, {
value: '2',
label: 'drink'
}, {
value: '3',
label: 'food'
}, {
value: '4',
label: '龙须面'
}, {
value: '5',
label: '北京烤鸭'
}],
options: [{
value: '1',
label: 'meat'
}, {
value: '2',
label: 'drink'
}, {
value: '3',
label: 'food'
}, {
value: '4',
label: '龙须面'
}, {
value: '5',
label: '北京烤鸭'
}],
value:""
}
},
methods:{
change(val) {
// this.value = val;
if (val) { //val存在
var _this=this
this.options = this.optionsCopy.filter((item) => {
if (!!~item.label.indexOf(val) || !!~item.label.toUpperCase().indexOf(val.toUpperCase())) {
console.log(item.label,'----',val)
if(item.label===val){
//如果要继续输入的可以匹配这里定时器更新，并且输入时候需关闭定时器
this.value=item.value
this.$refs.mySelect.blur()
}
return true
}
})
} else { //val为空时，还原数组
this.options = this.optionsCopy;
}
}
}
}
var Ctor = Vue.extend(Main)
new Ctor().$mount('#app')
{{value}}
v-for="item in options"
:key="item.value"
:label="item.label"
:value="item.value">
