// mycomponent/Waterfalls_flow.js var colOneHeight = 0; var colTwoHeight = 0; Component({ /** * 组件的属性列表 */ properties: { goodsData: { type: null }, handleTag: { value:false, type:null }, notap:{ value:false, type:Boolean } }, lifetimes: { attached: function() { // 在组件实例进入页面节点树时执行 colOneHeight = 0; colTwoHeight = 0; }, }, observers:{ 'goodsData': function(goodsData) { this.data.imgCount = 0; // 修改部分 // 判断是数据中的对象列表是否完全相同 let isRepeat = goodsData.every((item,index) => { return JSON.stringify(item) == JSON.stringify(this.data.activitys[index]) }); if(this.data.handleTag){ this.setData({ activitys: [], activitys1: [], activitys2: [], }); } if (goodsData.length > 0 && isRepeat) { // image组件在src的地址相同的情况下,不会触发load事件, 延迟赋值,让DOM层重新渲染 setTimeout(() => { this.setData({activitys: goodsData}) }, 500); } else { this.setData({activitys: goodsData}) } // 修改部分 } }, /** * 组件的初始数据 */ data: { activitys: [], activitys1: [], activitys2: [], showLoading: false, imgCount: 0 }, /** * 组件的方法列表 */ methods: { jumpDetails(e) { if(this.data.notap) return; let stick_id = e.currentTarget.dataset.stickid; wx.navigateTo({ url: '/packageC/micro_communities/microCommentDetails/microCommentDetails?stickId=' + stick_id }); }, onImageError(options) { // let currentId = options.currentTarget.id; console.log("图片加载发生错误"); this.onImageLoad({ currentTarget: { id: options.currentTarget.id }, detail: { width: 160, height: 160 }, type: 'error' }); }, /** * 图片加载函数 * 图片加载完成后,根据图片的高度,依次往第一列和第二列中推入数据 */ onImageLoad(options) { let currentId = options.currentTarget.id; let imageWidth = options.detail.width; // 图片宽度 let imageHeight = options.detail.height; // 图片高度 let activitys = this.data.activitys; // 获取所有的数据资源 let activityObj = null; let scle = (imageWidth / imageHeight); for (let i = 0; i < activitys.length; i++) { if (activitys[i].id == currentId) { if(options.type == 'error'&&activitys[i].has_many_image[0]){ activitys[i].has_many_image[0].url = "https://mini-app-img-1251768088.cos.ap-guangzhou.myqcloud.com/img_404.png"; } activityObj = activitys[i]; break; } } this.data.imgCount += 1; let activitys1 = this.data.activitys1; let activitys2 = this.data.activitys2; if (colOneHeight <= colTwoHeight) { colOneHeight += (176 / scle) + 60; activitys1.push(activityObj); } else { colTwoHeight += (176 / scle) + 60; activitys2.push(activityObj); } let data = { activitys1: activitys1, activitys2: activitys2 }; if (this.data.imgCount >= this.data.activitys.length) { this.setData({ showLoading: true }); } this.setData(data); }, } });