微信小程序如何实现搜索框的防抖功能
1、首先给输入框绑定一个bindinput事件,只要输入框内的值改变就会触发该函数
<input placeholder="请输入您要搜索的内容" bindinput="handleInput"> </input>
2、定义一个变量timeId,该值为定时器的返回值,作用是方便等会儿清除定时器。
3、在handleInput函数中先清除定时器,然后再设置一个定时器,发送请求,就实现了防抖功能。
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)}