300字范文,内容丰富有趣,生活中的好帮手!
300字范文 > 微信小程序如何实现搜索框的防抖功能

微信小程序如何实现搜索框的防抖功能

时间:2019-10-27 15:42:01

相关推荐

微信小程序如何实现搜索框的防抖功能

微信小程序如何实现搜索框的防抖功能

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)}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。