@@ -99,7 +99,7 @@ export default {
9999 scroll ( offset , up ) {
100100 const isUp = up === undefined ? offset < this . lastScrollTop : up
101101 this . lastScrollTop = offset
102- const { start, remain, cache, offsetTop , total, wrapHeight } = this
102+ const { start, remain, cache, total } = this
103103 /**
104104 * 元素比较少，还不需要懒加载
105105 */
@@ -109,7 +109,7 @@ export default {
109109 /**
110110 * 实际的滚动的高度要减去 offset
111111 */
112- const scrollTop = offset - offsetTop
112+ const scrollTop = offset - this . offsetTop
113113 /**
114114 * 位移修正（iOS offset 可能为负值）
115115 */
@@ -135,7 +135,7 @@ export default {
135135 * 2. 当前列表的第一个元素的顶部已经进入视口
136136 */
137137 if (
138- cache [ start + remain - 1 ] . top > scrollTop + wrapHeight ||
138+ cache [ start + remain - 1 ] . top > scrollTop + this . wrapHeight ||
139139 cache [ start ] . top > scrollTop
140140 ) {
141141 this . style . paddingTop -= cache [ start - 1 ] . height
@@ -156,7 +156,7 @@ export default {
156156 */
157157 if (
158158 cache [ start ] . bottom < scrollTop ||
159- cache [ start + remain - 1 ] . bottom < scrollTop + wrapHeight
159+ cache [ start + remain - 1 ] . bottom < scrollTop + this . wrapHeight
160160 ) {
161161 this . style . paddingTop += cache [ start ] . height
162162 this . start ++
@@ -168,11 +168,11 @@ export default {
168168 height : 0 ,
169169 paddingTop : 0
170170 }
171- this . cache = { }
172171 this . start = 0
172+ this . cache = { }
173173 } ,
174174 _adjustStart ( ) {
175- const { lastScrollTop , cache, start, isSameHeight , height , remain, column , offsetTop , total, wrapHeight } = this
175+ const { cache, start, remain, total } = this
176176 /**
177177 * 元素比较少，还不需要懒加载
178178 */
@@ -182,7 +182,7 @@ export default {
182182 /**
183183 * 如果在顶部，则直接修正
184184 */
185- const scrollTop = lastScrollTop - offsetTop
185+ const scrollTop = this . lastScrollTop - this . offsetTop
186186 if ( scrollTop <= 0 ) {
187187 this . style . paddingTop = 0
188188 this . start = 0
@@ -191,12 +191,14 @@ export default {
191191 /**
192192 * 如果触底了，则直接修正
193193 */
194- const scrollBottom = scrollTop + wrapHeight
194+ const scrollBottom = scrollTop + this . wrapHeight
195195 if ( scrollBottom >= cache [ total - 1 ] . bottom ) {
196196 this . start = total - remain
197197 this . style . paddingTop = cache [ total - remain ] . top
198198 return
199199 }
200+
201+ const { isSameHeight, column, height } = this
200202 /**
201203 * 向上修正
202204 */
@@ -219,7 +221,7 @@ export default {
219221 } else {
220222 /**
221223 * 如果元素不等高
222- * 从当前列表的上一个元素开始，到第 0 个元素结束开始循环
224+ * 从当前列表的上一个元素开始，到第 0 个元素结束
223225 * 寻找第一个顶部在视口边界的元素
224226 */
225227 for ( let i = start - 1 ; i >= 0 ; i -- ) {
@@ -254,7 +256,7 @@ export default {
254256 } else {
255257 /**
256258 * 如果元素不等高
257- * 从最后一个元素的下一个元素开始，到最后一个元素开始循环
259+ * 从当前列表的最后一个元素的下一个元素开始，到最后一个元素结束
258260 * 寻找第一个底部在视口边界的元素
259261 */
260262 for ( let i = start + remain ; i < total ; i ++ ) {
@@ -275,11 +277,12 @@ export default {
275277 adjustDown ( )
276278 } ,
277279 _computeRenderHeight ( items , offset ) {
278- const { height , isSameHeight , total, column, cache, isSingleColumn } = this
280+ const { total, column, cache } = this
279281 if ( ! total ) {
280282 return
281283 }
282- if ( isSameHeight ) {
284+ if ( this . isSameHeight ) {
285+ const height = this . height
283286 const end = items ? items . length : total - offset
284287 for ( let i = 0 ; i < end ; i ++ ) {
285288 const top = height * Math . floor ( ( i + offset ) / column )
@@ -291,10 +294,10 @@ export default {
291294 }
292295 this . style . height = height * total / column
293296 } else {
294- if ( isSingleColumn ) {
297+ if ( this . isSingleColumn ) {
295298 let beforeHeight = offset ? cache [ offset - 1 ] . bottom : 0
296299 items . forEach ( ( item , index ) => {
297- const hgt = + item . data . style . height . replace ( 'px' , '' )
300+ const hgt = parseInt ( item . data . style . height , 10 )
298301 cache [ index + offset ] = {
299302 height : hgt ,
300303 top : beforeHeight ,
@@ -316,7 +319,7 @@ export default {
316319 items . forEach ( ( item , index ) => {
317320 const realIndex = index + offset
318321 const beforeHeight = Math . min ( ...offsets )
319- const hgt = + item . data . style . height . replace ( 'px' , '' )
322+ const hgt = parseInt ( item . data . style . height , 10 )
320323 cache [ realIndex ] = {
321324 height : hgt ,
322325 top : beforeHeight ,
@@ -329,13 +332,13 @@ export default {
329332 }
330333 } ,
331334 _filter ( h ) {
332- const { remain, total, start, item, getter } = this
335+ const { remain, total, start, item } = this
333336 const end = remain >= total ? total : start + remain
334337
335338 if ( item ) {
336339 const result = [ ]
337340 for ( let i = start ; i < end ; i ++ ) {
338- result . push ( h ( item , getter ( i ) ) )
341+ result . push ( h ( item , this . getter ( i ) ) )
339342 }
340343 return result
341344 }
@@ -347,17 +350,14 @@ export default {
347350 }
348351 } ,
349352 render : function ( h ) {
350- const { paddingTop, height } = this . style
351- const list = this . _filter ( h )
352-
353353 return h ( 'div' , {
354354 'style' : {
355355 boxSizing : 'border-box' ,
356- height : ` ${ height } px` ,
357- paddingTop : `${ paddingTop } ,
358- willChange : 'padding-top'
356+ willChange : 'padding-top' ,
357+ paddingTop : `${ this . style . paddingTop } ,
358+ height : ` ${ this . style . height } px`
359359 } ,
360360 'class' : 'vue-flow-render'
361- } , list )
361+ } , this . _filter ( h ) )
362362 }
363363}
0 commit comments