- 当前 Bug 的表现（可附上截图）
小程序底部的名片列表页面加载速度特别慢
- 预期表现
- 复现路径
- 提供一个最简复现 Demo
wxml代码片段
<view class=“container” style=“height:100%;”>
<scroll-view id=“mp_list” hidden="{{articlesHide}}" bindscrolltolower=“onReachBottom” bindscroll=“scroll” scroll-y="{{true}}“scroll-top=”{{scrollTop}}“data-itemids=”{{currentItems}}" style=“height:100%;white-space: nowrap;”>
<view class=“swiper-tab”>
<button class=“swiper-tab-item {{currentTab==0 ? ‘on’ : ‘’}}” data-current=“0” bindtap=“swichNav”>新入</button>
<!-- <view class=“swiper-tab-item {{currentTab==1 ? ‘on’ : ‘’}}” data-current=“1” bindtap=“swichNav”>附近</view> -->
<button class=“swiper-tab-item {{currentTab==1 ? ‘on’ : ‘’}}” data-current=“1” bindtap=“swichNav” wx:if="{{userLocation}}">附近</button>
<button class=“swiper-tab-item {{currentTab==1 ? ‘on’ : ‘’}}” open-type=“openSetting” wx:else>附近</button>
<!-- <button open-type=“openSetting” bindopensetting=“callback”>打开设置页</button> -->
<button class=“swiper-tab-item {{currentTab==2 ? ‘on’ : ‘’}}” data-current=“2” bindtap=“swichNav”>热门</button>
</view>
<view style=“overflow: inherit” current="{{currentTab}}" class=“swiper-box” duration=“300”>
<view wx:if="{{currentTab==0}}">
<!-- <view class=“articles” bindscrolltolower=“loadMore” scroll-y="{{true}}" scroll-top="{{scrollTop}}"> -->
<view class=“articles”>
<view class=‘main’ wx:for="{{mpList}}" wx:key=“mpList” wx:if="{{mpList !== ‘’}}">
<navigator url=‘ta?business_card_id={{item.id}}’>
<view class=‘user’>
<view class=‘left’>
<image class=‘tx’ src=’{{item.avatar}}’></image>
</view>
<view class=‘right’>
<view class=‘name’>{{item.company}}</view>
<view class=‘fuwu’>{{item.industry}}</view>
<image class=‘smap’src=’…/images/my_map.png’></image>
<view class=‘gongsi’>{{item.address}}</view>
</view>
<view class=“rightright”>
<view class=‘right-top’>
<image src=’…/images/chakann.png’class=“chakann”></image>
</view>
<view class=‘right-btn’ wx:if="{{isdingwei==true}}"> {{item.juli}}km</view>
<view style=“display: flex; align-items: center;” class=‘right-btn’ wx:else="{{isdingwei==false}}">
<image style=“width:16px; height:14px; vertical-align: middle;” src=’…/images/see_num.png’></image>
<view style=“vertical-align: middle; margin-left:2px;”>{{item.see_count}}</view>
</view>
</view>
</view>
</navigator>
</view>
<view class=‘loadings’ wx:if="{{loadings}}">
<image class=‘loadingss’ src=’…/images/loading.gif’></image>
正在加载更多数据
</view>
<!-- <view class=‘nodatas’ wx:if="{{mpList == ‘’}}"> -->
<view class=‘nodatas’ wx:if="{{mpList_total == local_mpList_total}}">
<image src=’…/images/nodata.png’></image>
<view>暂无数据</view>
</view>
</view>
</view>
<view wx:if="{{currentTab==2}}">
<!-- <view class=“articles” bindtouchstart=“onTouchstartArticles” bindtouchend=“onTouchendArticles” hidden="{{articlesHide}}" bindscrolltolower=“loadMore” scroll-y="{{true}}" scroll-top="{{scrollTop}}" > -->
<view class=“articles”>
<view class=‘main’ wx:for="{{Lists}}" wx:key=“mpList” wx:if="{{mpList !== ‘’}}">
<navigator url=‘ta?business_card_id={{item.id}}’>
<view class=‘user’>
<view class=‘left’>
<image class=‘tx’ src=’{{item.avatar}}’></image>
<image class=‘vip’ src=’…/images/vip.png’></image>
</view>
<view class=‘right’>
<view class=‘name’>{{item.company}}</view>
<view class=‘fuwu’>{{item.industry}}</view>
<image class=‘smap’src=’…/images/my_map.png’></image>
<view class=‘gongsi’>{{item.address}}</view>
</view>
<view class=“rightright”>
<view class=‘right-top’>
<image src=’…/images/chakann.png’class=“chakann”></image>
</view>
<view class=‘right-btn’ wx:if="{{isdingwei==true}}">{{item.juli}}km</view>
<view style=“display: flex; align-items: center;” class=‘right-btn’ wx:else="{{isdingwei==false}}">
<image style=“width:16px; height:14px; vertical-align: middle;” src=’…/images/see_num.png’></image>
<view style=“vertical-align: middle; margin-left:2px;”>{{item.see_count}}</view>
</view>
</view>
</view>
</navigator>
</view>
<view class=‘loadings’ wx:if="{{loadings}}">
<image class=‘loadingss’ src=’…/images/loading.gif’></image>
正在加载更多数据
</view>
<view class=‘nodatas’ wx:if="{{Lists_total == local_Lists_total}}">
<image src=’…/images/nodata.png’></image>
<view>暂无数据</view>
</view>
</view>
</view>
</view>
</scroll-view>
</view>
<!–今日头条结束 -->
js代码片段
onReachBottom:function(){
this.loadMore();
},
//上拉事件
loadMore: function (e) { // 触底加载更多
console.log(13)
var that = this;
if(!canUseReachBottom) return;//如果触底函数不可用，则不调用网络请求数据
canUseReachBottom = false;//触底函数关闭
that.setData({
loadings: true
})
//setTimeout(function () {
that.setData({
loadings: false
})
// 页数
var page = that.data.page;
wx.showToast({
title:“加载中”,
icon:“loading”,
});
wx.request({
url: app.config.apiUrl + ‘Api/Business/getBusinessCards’,
method: ‘POST’,
header: {
‘content-type’: ‘application/json’
},
data: {
cmd: ‘get_business_cards’,
page: page,
per_page: 10,
/*category_id: that.data.currentItems,*/
user_id: that.data.user_id,
latitude: that.data.latitude,
longitude: that.data.longitude,
category: 1,
currentTab:that.data.currentTab,
},
success: function (res) {
if (res.data.code == 0) {
console.log(1001);
console.log(res.data.data);
var a,b,c;
if(res.data.data.business_cards_data.length>0 && res.data.data.business_cards_data && that.data.currentTab==0 ){
//a = that.data.mpList.concat(res.data.data.business_cards_data)
that.setData({
local_mpList_total : that.data.mpList.length+res.data.data.business_cards_data.length,
mpList:that.data.mpList.concat(res.data.data.business_cards_data)
})
}
if(res.data.data.fujin.length>0 && res.data.data.fujin && that.data.currentTab==1){
//b= that.data.List.concat(res.data.data.fujin);
that.setData({
local_List_total :that.data.List.length+res.data.data.fujin.length,
List:that.data.List.concat(res.data.data.fujin)
});
}
if(res.data.data.rm.length>0 && res.data.data.rm && that.data.currentTab==2){
//c = that.data.Lists.concat(res.data.data.rm);
that.setData({
local_Lists_total :that.data.Lists.length+res.data.data.rm.length,
Lists: that.data.Lists.concat(res.data.data.rm),
})
}
that.setData({
scrollweizhi:that.data.scrollweizhi+130,
});
that.setData({
scrollTop:that.data.scrollweizhi
});
that.setData({
page: page + 1,
loadings: false,
loadingsbg: false,
mpList_total :res.data.data.business_cards_data_total,
List_total : res.data.data.fujin_total,
Lists_total: res.data.data.rm_total,
})
}
canUseReachBottom = true;//有新数据，触底函数开启，为下次触底调用做准备
wx.hideToast();
}
});
//}, 100)
}
强力驱动