From c035b2468012c24465f0378086a210d3122a2598 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=92=8B=E7=91=B6?= Date: Thu, 11 Apr 2019 11:01:59 +0800 Subject: [PATCH 1/2] =?UTF-8?q?fix(recycle-view):=20#16=20=E4=BF=AE?= =?UTF-8?q?=E5=A4=8DforceUpdate=E6=97=B6=E8=AE=A1=E7=AE=97slot-before?= =?UTF-8?q?=EF=BC=8Cslot-after=E6=97=A0=E6=95=88?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/recycle-view.js | 34 ++++++++++++++++++++-------------- 1 file changed, 20 insertions(+), 14 deletions(-) diff --git a/src/recycle-view.js b/src/recycle-view.js index 5a8acbd..6224a6f 100644 --- a/src/recycle-view.js +++ b/src/recycle-view.js @@ -550,20 +550,26 @@ Component({ // 重新渲染事件发生 let beforeReady = false let afterReady = false - this.createSelectorQuery().select('.slot-before').boundingClientRect((rect) => { - beforeSlotHeight = rect.height - beforeReady = true - if (afterReady) { - if (newCb) { newCb() } - } - }).exec() - this.createSelectorQuery().select('.slot-after').boundingClientRect((rect) => { - afterSlotHeight = rect.height - afterReady = true - if (beforeReady) { - if (newCb) { newCb() } - } - }).exec() + // fix:#16 确保获取slot节点实际高度 + this.setData({ + hasBeforeSlotHeight: false, + hasAfterSlotHeight: false, + }, () => { + this.createSelectorQuery().select('.slot-before').boundingClientRect((rect) => { + beforeSlotHeight = rect.height + beforeReady = true + if (afterReady) { + if (newCb) { newCb() } + } + }).exec() + this.createSelectorQuery().select('.slot-after').boundingClientRect((rect) => { + afterSlotHeight = rect.height + afterReady = true + if (beforeReady) { + if (newCb) { newCb() } + } + }).exec() + }) }, _setInnerBeforeAndAfterHeight(obj) { if (typeof obj.beforeHeight !== 'undefined') { From 6104193aabcae78ede93172aeaaf39608b108062 Mon Sep 17 00:00:00 2001 From: =?UTF-8?q?=E8=92=8B=E7=91=B6?= Date: Thu, 11 Apr 2019 17:10:31 +0800 Subject: [PATCH 2/2] =?UTF-8?q?fix:=20=E4=BF=AE=E5=A4=8Drecycle-item?= =?UTF-8?q?=E8=BF=87=E9=AB=98=E5=AF=BC=E8=87=B4=E7=99=BD=E5=B1=8F=E9=97=AE?= =?UTF-8?q?=E9=A2=98?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit --- src/utils/recycle-context.js | 32 ++++++++++++++++++++++++++++++-- 1 file changed, 30 insertions(+), 2 deletions(-) diff --git a/src/utils/recycle-context.js b/src/utils/recycle-context.js index 9a47e83..3e1f283 100644 --- a/src/utils/recycle-context.js +++ b/src/utils/recycle-context.js @@ -337,8 +337,9 @@ RecycleContext.prototype._recalculateSize = function (list) { let line = 0 let column = 0 const sizeArray = [] + const listLen = list.length // 把整个页面拆分成200*200的很多个方格, 判断每个数据落在哪个方格上 - for (let i = 0; i < list.length; i++) { + for (let i = 0; i < listLen; i++) { if (typeof list[i].__index__ === 'undefined') { list[i].__index__ = i } @@ -358,13 +359,26 @@ RecycleContext.prototype._recalculateSize = function (list) { // 判断数据落到哪个方格上 // 超过了宽度, 移动到下一行, 再根据高度判断是否需要移动到下一个方格 if (offsetLeft + itemSize.width > compData.width) { + column = 0 offsetLeft = itemSize.width offsetTop += sizeArray[sizeArray.length - 2].height // 加上最后一个数据的高度 // 根据高度判断是否需要移动到下一个方格 if (offsetTop >= RECT_SIZE * (line + 1)) { + // fix: 当区块比较大时,会缺失块区域信息 + const lastIdx = i - 1 + const lastLine = line + line += parseInt((offsetTop - RECT_SIZE * line) / RECT_SIZE, 10) + + for (let idx = lastLine; idx < line; idx++) { + const key = `${idx}.${column}` + if (!sizeMap[key]) { + sizeMap[key] = [] + } + sizeMap[key].push(lastIdx) + } } - column = 0 + // 新起一行的元素, beforeHeight是前一个元素的beforeHeight和height相加 if (i === 0) { itemSize.beforeHeight = 0 @@ -389,6 +403,20 @@ RecycleContext.prototype._recalculateSize = function (list) { (sizeMap[key] = []) } sizeMap[key].push(i) + + // fix: 当区块比较大时,会缺失块区域信息 + if (listLen - 1 === i && itemSize.height > RECT_SIZE) { + const lastIdx = line + offsetTop += itemSize.height + line += parseInt((offsetTop - RECT_SIZE * line) / RECT_SIZE, 10) + for (let idx = lastIdx; idx <= line; idx++) { + const key = `${idx}.${column}` + if (!sizeMap[key]) { + sizeMap[key] = [] + } + sizeMap[key].push(i) + } + } } // console.log('sizeMap', sizeMap) const obj = {