Skip to content

Commit

Permalink
optimize code
Browse files Browse the repository at this point in the history
  • Loading branch information
@falstack
falstack committed Aug 4, 2019
1 parent 68d0cac commit 9debc07
Show file tree
Hide file tree
Showing 3 changed files with 63 additions and 63 deletions.
10 changes: 5 additions & 5 deletions package.json
View file
Original file line number Diff line number Diff line change
@@ -1,6 +1,6 @@
{
"name": "vue-flow-render",
"version": "0.1.39",
"version": "1.0.0",
"main": "dist/vue-flow-render.umd.min.js",
"files": [
"dist"
Expand Down Expand Up @@ -29,10 +29,10 @@
"vue": "^2.6.10"
},
"devDependencies": {
"@vue/cli-plugin-babel": "^3.9.2",
"@vue/cli-plugin-eslint": "^3.9.2",
"@vue/cli-plugin-unit-jest": "^3.9.0",
"@vue/cli-service": "^3.9.3",
"@vue/cli-plugin-babel": "^3.10.0",
"@vue/cli-plugin-eslint": "^3.10.0",
"@vue/cli-plugin-unit-jest": "^3.10.0",
"@vue/cli-service": "^3.10.0",
"@vue/eslint-config-prettier": "^5.0.0",
"@vue/test-utils": "1.0.0-beta.29",
"babel-core": "7.0.0-bridge.0",
Expand Down
48 changes: 24 additions & 24 deletions src/render.js
View file
Original file line number Diff line number Diff line change
Expand Up @@ -99,7 +99,7 @@ export default {
scroll (offset, up) {
const isUp = up === undefined ? offset < this.lastScrollTop : up
this.lastScrollTop = offset
const { start, remain, cache, offsetTop, total, wrapHeight } = this
const { start, remain, cache, total } = this
/**
* 元素比较少，还不需要懒加载
*/
Expand All @@ -109,7 +109,7 @@ export default {
/**
* 实际的滚动的高度要减去 offset
*/
const scrollTop = offset - offsetTop
const scrollTop = offset - this.offsetTop
/**
* 位移修正（iOS offset 可能为负值）
*/
Expand All @@ -135,7 +135,7 @@ export default {
* 2. 当前列表的第一个元素的顶部已经进入视口
*/
if (
cache[start + remain - 1].top > scrollTop + wrapHeight ||
cache[start + remain - 1].top > scrollTop + this.wrapHeight ||
cache[start].top > scrollTop
) {
this.style.paddingTop -= cache[start - 1].height
Expand All @@ -156,7 +156,7 @@ export default {
*/
if (
cache[start].bottom < scrollTop ||
cache[start + remain - 1].bottom < scrollTop + wrapHeight
cache[start + remain - 1].bottom < scrollTop + this.wrapHeight
) {
this.style.paddingTop += cache[start].height
this.start++
Expand All @@ -168,11 +168,11 @@ export default {
height: 0,
paddingTop: 0
}
this.cache = {}
this.start = 0
this.cache = {}
},
_adjustStart () {
const { lastScrollTop, cache, start, isSameHeight, height, remain, column, offsetTop, total, wrapHeight } = this
const { cache, start, remain, total } = this
/**
* 元素比较少，还不需要懒加载
*/
Expand All @@ -182,7 +182,7 @@ export default {
/**
* 如果在顶部，则直接修正
*/
const scrollTop = lastScrollTop - offsetTop
const scrollTop = this.lastScrollTop - this.offsetTop
if (scrollTop <= 0) {
this.style.paddingTop = 0
this.start = 0
Expand All @@ -191,12 +191,14 @@ export default {
/**
* 如果触底了，则直接修正
*/
const scrollBottom = scrollTop + wrapHeight
const scrollBottom = scrollTop + this.wrapHeight
if (scrollBottom >= cache[total - 1].bottom) {
this.start = total - remain
this.style.paddingTop = cache[total - remain].top
return
}

const { isSameHeight, column, height } = this
/**
* 向上修正
*/
Expand All @@ -219,7 +221,7 @@ export default {
} else {
/**
* 如果元素不等高
* 从当前列表的上一个元素开始，到第 0 个元素结束开始循环
* 从当前列表的上一个元素开始，到第 0 个元素结束
* 寻找第一个顶部在视口边界的元素
*/
for (let i = start - 1; i >= 0; i--) {
Expand Down Expand Up @@ -254,7 +256,7 @@ export default {
} else {
/**
* 如果元素不等高
* 从最后一个元素的下一个元素开始，到最后一个元素开始循环
* 从当前列表的最后一个元素的下一个元素开始，到最后一个元素结束
* 寻找第一个底部在视口边界的元素
*/
for (let i = start + remain; i < total; i++) {
Expand All @@ -275,11 +277,12 @@ export default {
adjustDown()
},
_computeRenderHeight (items, offset) {
const { height, isSameHeight, total, column, cache, isSingleColumn } = this
const { total, column, cache } = this
if (!total) {
return
}
if (isSameHeight) {
if (this.isSameHeight) {
const height = this.height
const end = items ? items.length : total - offset
for (let i = 0; i < end; i++) {
const top = height * Math.floor((i + offset) / column)
Expand All @@ -291,10 +294,10 @@ export default {
}
this.style.height = height * total / column
} else {
if (isSingleColumn) {
if (this.isSingleColumn) {
let beforeHeight = offset ? cache[offset - 1].bottom : 0
items.forEach((item, index) => {
const hgt = +item.data.style.height.replace('px', '')
const hgt = parseInt(item.data.style.height, 10)
cache[index + offset] = {
height: hgt,
top: beforeHeight,
Expand All @@ -316,7 +319,7 @@ export default {
items.forEach((item, index) => {
const realIndex = index + offset
const beforeHeight = Math.min(...offsets)
const hgt = +item.data.style.height.replace('px', '')
const hgt = parseInt(item.data.style.height, 10)
cache[realIndex] = {
height: hgt,
top: beforeHeight,
Expand All @@ -329,13 +332,13 @@ export default {
}
},
_filter (h) {
const { remain, total, start, item, getter } = this
const { remain, total, start, item } = this
const end = remain >= total ? total : start + remain

if (item) {
const result = []
for (let i = start; i < end; i++) {
result.push(h(item, getter(i)))
result.push(h(item, this.getter(i)))
}
return result
}
Expand All @@ -347,17 +350,14 @@ export default {
}
},
render: function (h) {
const { paddingTop, height } = this.style
const list = this._filter(h)

return h('div', {
'style': {
boxSizing: 'border-box',
height: `${height}px`,
paddingTop: `${paddingTop}px`,
willChange: 'padding-top'
willChange: 'padding-top',
paddingTop: `${this.style.paddingTop}px`,
height: `${this.style.height}px`
},
'class': 'vue-flow-render'
}, list)
}, this._filter(h))
}
}
68 changes: 34 additions & 34 deletions yarn.lock
View file
Original file line number Diff line number Diff line change
Expand Up @@ -928,10 +928,10 @@
lodash.kebabcase "^4.1.1"
svg-tags "^1.0.0"

"@vue/babel-preset-app@^3.9.2":
version "3.9.2"
resolved "https://registry.npm.taobao.org/@vue/babel-preset-app/download/@vue/babel-preset-app-3.9.2.tgz#b72a9b06abbe3f8f272783be13951271277be338"
integrity sha1-tyqbBqu+P48nJ4O+E5UScSd74zg=
"@vue/babel-preset-app@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/babel-preset-app/-/babel-preset-app-3.10.0.tgz#3f89d631dd0f174c8a72e769b55f081c533c4677"
integrity sha512-NzJLI4Qe0SYm9gVHQC9RXyP0YcPjI28TmZ0ds2RJa9NO96LXHLES2U1HqiMDN4+CVjOQFrWUNd7wWeaETRPXbg==
dependencies:
"@babel/helper-module-imports" "^7.0.0"
"@babel/plugin-proposal-class-properties" "^7.0.0"
Expand Down Expand Up @@ -994,28 +994,28 @@
"@vue/babel-plugin-transform-vue-jsx" "^1.0.0"
camelcase "^5.0.0"

"@vue/cli-overlay@^3.9.0":
version "3.9.0"
resolved "https://registry.npm.taobao.org/@vue/cli-overlay/download/@vue/cli-overlay-3.9.0.tgz#11f513d1fa11b0135fb8ba8b88d228df0dc542e0"
integrity sha1-EfUT0foRsBNfuLqLiNIo3w3FQuA=
"@vue/cli-overlay@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/cli-overlay/-/cli-overlay-3.10.0.tgz#9266c96fb2bffd35ca96edd8e1e1284ca8c00c94"
integrity sha512-DQCY6WIl1UN1nOuPirW63CcYWSBdIn6s4zdGfFodCfV+0PAEXGcrfNStygG+IKUsydQaJGTneV7SFxcS+9gyzA==

"@vue/cli-plugin-babel@^3.9.2":
version "3.9.2"
resolved "https://registry.npm.taobao.org/@vue/cli-plugin-babel/download/@vue/cli-plugin-babel-3.9.2.tgz#8ff962a383aaeafd2b280998428a57ea23e9539c"
integrity sha1-j/lio4Oq6v0rKAmYQopX6iPpU5w=
"@vue/cli-plugin-babel@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/cli-plugin-babel/-/cli-plugin-babel-3.10.0.tgz#3c5300bd6daf30b53292a6c3982e3a681cba2c18"
integrity sha512-NHrg6ZYN2fh5ZiMMzCNRuDlH9mcTOu+GIti1Va/zPnG3qMkX2iZ0zZGFaOCltIFoVSXdyOfa0sMtJGDoP9Q7ZA==
dependencies:
"@babel/core" "^7.0.0"
"@vue/babel-preset-app" "^3.9.2"
"@vue/cli-shared-utils" "^3.9.0"
"@vue/babel-preset-app" "^3.10.0"
"@vue/cli-shared-utils" "^3.10.0"
babel-loader "^8.0.5"
webpack ">=4 < 4.29"

"@vue/cli-plugin-eslint@^3.9.2":
version "3.9.2"
resolved "https://registry.npm.taobao.org/@vue/cli-plugin-eslint/download/@vue/cli-plugin-eslint-3.9.2.tgz#747c616b13a11f34ac80554eee899cbfcd1977b8"
integrity sha1-dHxhaxOhHzSsgFVO7omcv80Zd7g=
"@vue/cli-plugin-eslint@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/cli-plugin-eslint/-/cli-plugin-eslint-3.10.0.tgz#44a2abcecadc5b4854ee8fc4a7c5930f660293b0"
integrity sha512-grM3Z4je8XlPomhYqTC4ILB26rTrJKZhEkCwbXdduMrWtpn2Ggotl2nYayplOzDgoZ4Cx3ykJMkRulla2Zi47g==
dependencies:
"@vue/cli-shared-utils" "^3.9.0"
"@vue/cli-shared-utils" "^3.10.0"
babel-eslint "^10.0.1"
eslint-loader "^2.1.2"
globby "^9.2.0"
Expand All @@ -1025,12 +1025,12 @@
eslint "^4.19.1"
eslint-plugin-vue "^4.7.1"

"@vue/cli-plugin-unit-jest@^3.9.0":
version "3.9.0"
resolved "https://registry.npm.taobao.org/@vue/cli-plugin-unit-jest/download/@vue/cli-plugin-unit-jest-3.9.0.tgz#0662adee9467006381b9cddc7fb3b0a21ccbbd07"
integrity sha1-BmKt7pRnAGOBuc3cf7OwohzLvQc=
"@vue/cli-plugin-unit-jest@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/cli-plugin-unit-jest/-/cli-plugin-unit-jest-3.10.0.tgz#6fe6d712d9a089239ae4a9f5c18888fe720f285c"
integrity sha512-5+BLqwkjpU+LMxilzSMIy6bo20ygWGULJ9a4/za+u72ebMic0F1mFwS28niW5mEZheUQU3vzSTyVBfJ4Wj8dow==
dependencies:
"@vue/cli-shared-utils" "^3.9.0"
"@vue/cli-shared-utils" "^3.10.0"
babel-jest "^23.6.0"
babel-plugin-transform-es2015-modules-commonjs "^6.26.2"
jest "^23.6.0"
Expand All @@ -1039,15 +1039,15 @@
jest-watch-typeahead "0.2.1"
vue-jest "^3.0.4"

"@vue/cli-service@^3.9.3":
version "3.9.3"
resolved "https://registry.npm.taobao.org/@vue/cli-service/download/@vue/cli-service-3.9.3.tgz#4bd5786465afb8b608c5c7fc9661390e747ea756"
integrity sha1-S9V4ZGWvuLYIxcf8lmE5DnR+p1Y=
"@vue/cli-service@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/cli-service/-/cli-service-3.10.0.tgz#1e61afac9eeed5d902c124715c29719abeb743c5"
integrity sha512-aQaAjtkpSl4XFBM7Di9doh4GvHp1H8/H1QJKRK8bPJ5MVbt8Lt4tBo+YgK9Qs/9x0mrxCAa5UrR9+8ZWIQs2Zw==
dependencies:
"@intervolga/optimize-cssnano-plugin" "^1.0.5"
"@soda/friendly-errors-webpack-plugin" "^1.7.1"
"@vue/cli-overlay" "^3.9.0"
"@vue/cli-shared-utils" "^3.9.0"
"@vue/cli-overlay" "^3.10.0"
"@vue/cli-shared-utils" "^3.10.0"
"@vue/component-compiler-utils" "^2.6.0"
"@vue/preload-webpack-plugin" "^1.1.0"
"@vue/web-component-wrapper" "^1.2.0"
Expand Down Expand Up @@ -1101,10 +1101,10 @@
webpack-dev-server "^3.4.1"
webpack-merge "^4.2.1"

"@vue/cli-shared-utils@^3.9.0":
version "3.9.0"
resolved "https://registry.npm.taobao.org/@vue/cli-shared-utils/download/@vue/cli-shared-utils-3.9.0.tgz#cb56a443bf763a873849a11d07e9e7638aa16cc2"
integrity sha1-y1akQ792Ooc4SaEdB+nnY4qhbMI=
"@vue/cli-shared-utils@^3.10.0":
version "3.10.0"
resolved "https://registry.yarnpkg.com/@vue/cli-shared-utils/-/cli-shared-utils-3.10.0.tgz#9d156f3c0ef675a939319062489e98c8d3d80f7e"
integrity sha512-i96XBUtLdWeKFCC/ot12ngqnVikN/dXpelGdyxvNZczCkX7Je0FUdrZkiw0+uTYTu1RmuYWpLs+vb/YQerjiWg==
dependencies:
"@hapi/joi" "^15.0.1"
chalk "^2.4.1"
Expand Down

0 comments on commit 9debc07

Please sign in to comment.