微信小程序input输入框的bindinput,每输入一个字符都会触发一次,为了避免频繁触发bindinput绑定的函数,可采用”防抖“功能。
防抖:在执行bindinput时,第一次触发时,会先设置一个定时器,比如定时1000ms(1秒),在定时器1000毫秒之后,才执行bindinput绑定的函数,即延迟了函数的执行时间,第二次触发时,如果两次时间间隔小于1000毫秒,则清除上一次的定时器(即取消第一次的函数执行),然后设置新定时器,即定时1000毫秒后进行第二次函数操作,以此类推,直至最后一次执行bindinput时,在定时器时间结束时,执行bindinput绑定的函数。
一下代码未进行时间间隔判断,大家可以自行加入。
timeId:0,
//输入框内的值改变就会触发该函数
handleInput(e) {
const {value} = e.detail //拿到输入框中的值
clearTimeout(this.timeId) //清除定时器
this.timeId = setTimeout(()=>{
this.search(value) //发送请求,间隔时间为1s
},1000)
},
//向后台发起搜索的request请求
search(value) {
const {data} = request({url: '地址', data: {value}})
console.log(data)
}