compositionstart事件只有在输入中文时才会触发,触发事件在input事件之前;compositionend表示结束中文输入时触发的事件,不管最后输入的是不是中文都会触发
<v-text-field
class="mr-4"
v-model.trim="searchName"
@compositionstart="flag = false"
@compositionend="flag = true"
@input="searchCurName(searchName)"
@keyup="searchCurName(searchName)"
@keyup.enter="searchCurName(searchName)"
@click:append="searchCurName(searchName)"
append-icon="mdi-magnify"
placeholder="搜索站点或直接输入地址"
dense
hide-details
></v-text-field>
export default {
name: "PcApplication",
data() {
return {
searchName:null,
flag:true
}
},
methods:{
searchCurName(name) {
const searchName = name.toLowerCase();
if (searchName && this.flag) {
this.applications = this.applications.filter(item =>
item.name.toLowerCase().includes(searchName)
);
this.expApplications = this.expApplications.map(item => {
item.links = item.links.filter(itm =>
itm.name.toLowerCase().includes(searchName)
);
return item;
});
this.searchNavigations = true;
}
},
}
}