監(jiān)聽輸入事件時,你一定遇到過這樣的情況:
在中文狀態(tài)下向輸入框中輸入‘地球’二字掌呜,在我們按 ‘空格’前皿桑,拼音‘diqiu'在按每個字母時都會觸發(fā)代碼執(zhí)行一次行瑞,若處理中存在ajax請求就會出現(xiàn)多次調用的情況紧卒。這顯然不是我們想要的侥衬,我們想要的僅僅是當’地球‘二字輸入的時候才會觸發(fā)代碼執(zhí)行,這難么跑芳,難么轴总,難么~~~
其實不難,使用Vue的v-model指令和watch監(jiān)聽博个,就可以輕松實現(xiàn)怀樟,哈哈哈哈,繼續(xù)吧
直接干貨盆佣,上菜
<div id="app">
<input v-model="msg" >
</div>
nev Vue({
el: '#app',
data: {
msg: ''
},
watch: {
msg(newvalue, oldvalue) {
console.log(newvalue, oldvalue)
// 還可以做很多操作哦
}
}
})
快動手試試吧往堡。械荷。。