环境:vue、mint-ui
功能:一个输入框,按下按键之后就执行某个功能。
截图:一个输入框
输入框html:
<mt-search v-model="query" cancel-text="" placeholder="提取码"> // mt-search
基本函数:
debounce (func, delay) {
let timer
return function (...args) {
if (timer) {
clearTimeout(timer)
}
timer = setTimeout(() => {
func.apply(this, args)
}, delay)
}
}
查询函数:
getData () {
console.log('执行查询。。。。。。')
},
主要函数:
created() {
this.$watch('query', this.debounce(newQuery => {
if (newQuery) {
setTimeout(() => {
this.getData()
}, 20)
}
}, 200))
},