[Improvement] reduce scroll utils (#1112)

This commit is contained in:
neverland 2018-05-20 00:07:45 +08:00 committed by GitHub
parent d15efd756e
commit b5139b18eb
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
2 changed files with 6 additions and 51 deletions

View File

@ -1,33 +1,7 @@
import { isServer } from './index'; import { isServer } from './';
export default { export default {
debounce(func, wait, immediate) { // get nearest scroll element
let timeout, args, context, timestamp, result;
return function() {
context = this;
args = arguments;
timestamp = new Date();
const later = () => {
const last = (new Date()) - timestamp;
if (last < wait) {
timeout = setTimeout(later, wait - last);
} else {
timeout = null;
result = func.apply(context, args);
}
};
if (!timeout) {
timeout = setTimeout(later, wait);
}
return result;
};
},
/*
* @param {Element} element
* @param {Element} rootElement
* @return {Element | window}
*/
getScrollEventTarget(element, rootParent = window) { getScrollEventTarget(element, rootParent = window) {
let currentNode = element; let currentNode = element;
// bugfix, see http://w3help.org/zh-cn/causes/SD9013 and http://stackoverflow.com/questions/17016740/onscroll-function-is-not-working-for-chrome // bugfix, see http://w3help.org/zh-cn/causes/SD9013 and http://stackoverflow.com/questions/17016740/onscroll-function-is-not-working-for-chrome
@ -41,32 +15,15 @@ export default {
return rootParent; return rootParent;
}, },
// 判断元素是否被加入到页面节点内
isAttached(element) {
let currentNode = element.parentNode;
while (currentNode) {
if (currentNode.tagName === 'HTML') {
return true;
}
if (currentNode.nodeType === 11) {
return false;
}
currentNode = currentNode.parentNode;
}
return false;
},
// 获取滚动高度
getScrollTop(element) { getScrollTop(element) {
return 'scrollTop' in element ? element.scrollTop : element.pageYOffset; return 'scrollTop' in element ? element.scrollTop : element.pageYOffset;
}, },
// 设置滚动高度
setScrollTop(element, value) { setScrollTop(element, value) {
'scrollTop' in element ? element.scrollTop = value : element.scrollTo(element.scrollX, value); 'scrollTop' in element ? element.scrollTop = value : element.scrollTo(element.scrollX, value);
}, },
// 获取元素距离顶部高度 // get distance from element top to page top
getElementTop(element) { getElementTop(element) {
return (element === window ? 0 : element.getBoundingClientRect().top) + this.getScrollTop(window); return (element === window ? 0 : element.getBoundingClientRect().top) + this.getScrollTop(window);
}, },

View File

@ -12,7 +12,7 @@ function doBindEvent() {
} }
this.el[CONTEXT].binded = true; this.el[CONTEXT].binded = true;
this.scrollEventListener = Utils.debounce(handleScrollEvent.bind(this), 200); this.scrollEventListener = handleScrollEvent.bind(this);
this.scrollEventTarget = Utils.getScrollEventTarget(this.el); this.scrollEventTarget = Utils.getScrollEventTarget(this.el);
const disabledExpr = this.el.getAttribute('waterfall-disabled'); const disabledExpr = this.el.getAttribute('waterfall-disabled');
@ -78,10 +78,8 @@ function handleScrollEvent() {
function startBind(el) { function startBind(el) {
const context = el[CONTEXT]; const context = el[CONTEXT];
context.vm.$nextTick(function() { context.vm.$nextTick(() => {
if (Utils.isAttached(el)) {
doBindEvent.call(el[CONTEXT]); doBindEvent.call(el[CONTEXT]);
}
}); });
} }