小程序防抖功能以及wx:for的使用

防抖功能:
微信小程序的防抖功能主要是为了避免重复发送请求的这种情况发送,主要原理就是利用定时器来阻止重复发送请求!
首先要在页面对应的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();
                }
            }
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值