Compare commits

...

1 Commits

Author SHA1 Message Date
ZhaoTongYao 08fa917841 一键服务图片懒加载; 5 years ago
  1. 28
      subpages/oneKeyService/pages/index/index.js
  2. 4
      subpages/oneKeyService/pages/index/index.wxml

28
subpages/oneKeyService/pages/index/index.js

@ -1,4 +1,7 @@
const api = require('../../../../utils/understandJs') const api = require('../../../../utils/understandJs')
let _observers = []
Page({ Page({
/** /**
@ -45,6 +48,9 @@ Page({
pid: this.data.pid pid: this.data.pid
} }
api.moduleCategory(params).then(res => { api.moduleCategory(params).then(res => {
res.data.forEach((item, key) => {
item.imgLoad = false
})
console.log(res.data) console.log(res.data)
this.setData({ this.setData({
modulelist: this.data.modulelist.concat(res.data), modulelist: this.data.modulelist.concat(res.data),
@ -58,6 +64,20 @@ Page({
loadMoreVisible: false, loadMoreVisible: false,
}) })
} }
_observers = []
this.data.modulelist.forEach((item, key) => {
if (!item.imgLoad) {
_observers[key] = wx.createIntersectionObserver(this)
_observers[key].relativeToViewport({bottom: 20})
.observe('#img-btn-'+key, (res) => {
_observers[key].disconnect()
item.imgLoad = true
this.setData({
modulelist: this.data.modulelist
})
})
}
})
}).catch(err => { }).catch(err => {
this.setData({ this.setData({
modulelist: [], modulelist: [],
@ -83,7 +103,13 @@ Page({
this.getModuleCategory() this.getModuleCategory()
} }
}, },
onUnload () {
_observers.forEach((item, key) => {
if (!item._disconnected) {
_observers[key].disconnect()
}
})
},
//政策、通知 /subpages/home/pages/noticeNew/noticeNew //政策、通知 /subpages/home/pages/noticeNew/noticeNew
goDetails(e) {//模块编码(政策,通知,档案,警事,一键直通) goDetails(e) {//模块编码(政策,通知,档案,警事,一键直通)
if (e.currentTarget.dataset.modulestyle == '4') { if (e.currentTarget.dataset.modulestyle == '4') {

4
subpages/oneKeyService/pages/index/index.wxml

@ -1,4 +1,5 @@
<button class="index top" <button class="index top"
id="img-btn-{{index}}"
hover-class="hover-btn" hover-class="hover-btn"
bindtap="goDetails" bindtap="goDetails"
wx:for-item="item" wx:for-item="item"
@ -10,12 +11,13 @@
data-categoryCode="{{item.categoryCode}}" data-categoryCode="{{item.categoryCode}}"
data-moduleStyle="{{item.moduleStyle}}" data-moduleStyle="{{item.moduleStyle}}"
data-categoryName="{{item.categoryName}}"> data-categoryName="{{item.categoryName}}">
<image class="img-bj" src="{{item.imgUrl}}"></image> <image class="img-bj" src="{{item.imgUrl}}" wx:if="{{item.imgLoad}}"></image>
<!-- <view class="shadow"> <!-- <view class="shadow">
<image class="img-name" src="../../images/jsyx.png"></image> <image class="img-name" src="../../images/jsyx.png"></image>
</view> --> </view> -->
</button> </button>
<!-- <load-more loadMoreType="{{loadMoreType}}" loadMoreVisible="{{loadMoreVisible && isLoadMore}}"></load-more> --> <!-- <load-more loadMoreType="{{loadMoreType}}" loadMoreVisible="{{loadMoreVisible && isLoadMore}}"></load-more> -->
<no-data isShow="{{nodata}}"></no-data> <no-data isShow="{{nodata}}"></no-data>
Loading…
Cancel
Save