防抖功能:
微信小程序的防抖功能主要是为了避免重复发送请求的这种情况发送,主要原理就是利用定时器来阻止重复发送请求!
首先要在页面对应的js中加入变量TimeNum = -1;
TimeNum = -1
\然后设置一个定时器,在定时器内部发送请求!我这里的是每隔一秒发送一次!
this.TimeNum =setTimeout(()=>{
const req = await request({url:…….});//发送请求
},1000);
然后就是发送完成,清除定时器
clearTimeout(this.TimeNum);
wx:for的使用:
<navigator class="first_item" wx:for="{{goodsList}}"
wx:for-index="index" wx:key="goods_id"
url="/pages/goods_detail/goods_detail?goods_id={{item.goods_id}}">
<!-- 左边图片容器 -->
<view class="good_img_wrap">
<image mode="widthFix" src="{{item.goods_small_logo?item.goods_small_logo:'https://ww1.sinaimg.cn/large/007rAy9hgy1g24by9t530j30i20i2glm.jpg'}}"/>
</view>
<!-- 右边商品容器 -->
<view class="good_info_wrap">
<view class="good_name">{{item.goods_name}}</view>
<view class="good_price">¥ {{item.goods_price}}</view>
</view>
</navigator>
然后就是就是js里面的方法了
wx.request({
url:"/goods/search"
data: QueryParams,
url:base_url+params.url,
success:(result)=>{
this.setData({
// 拼接两个数组
goodsList:[...this.data.goodsList,...result.goods],
totalPage:Math.ceil(result.total/this.QueryParams.pagesize)
})
},
fail:(err)=>{
console.log(err);
},complete:()=>{
ajaxTimes--;
if(ajaxTimes===0){
wx.hideLoading();
}
}