[type] scroll (#2704)

This commit is contained in:
neverland 2019-02-08 21:49:22 +08:00 committed by GitHub
parent f7e3c71b6e
commit 1e873f03ab
No known key found for this signature in database
GPG Key ID: 4AEE18F83AFDEB23
3 changed files with 50 additions and 43 deletions

View File

@ -3,7 +3,11 @@ import { isDef, isObj } from '.';
const { hasOwnProperty } = Object.prototype;
function assignKey(to, from, key) {
type Object = {
[key: string]: any;
}
function assignKey(to: Object, from: Object, key: string) {
const val = from[key];
if (!isDef(val) || (hasOwnProperty.call(to, key) && !isDef(to[key]))) {
@ -17,7 +21,7 @@ function assignKey(to, from, key) {
}
}
export default function assign(to, from) {
export default function assign(to: Object, from: Object) {
Object.keys(from).forEach(key => {
assignKey(to, from, key);
});

View File

@ -1,41 +0,0 @@
import { isServer } from '.';
export const getComputedStyle = !isServer && document.defaultView.getComputedStyle.bind(document.defaultView);
// get nearest scroll element
// http://w3help.org/zh-cn/causes/SD9013
// http://stackoverflow.com/questions/17016740/onscroll-function-is-not-working-for-chrome
export function getScrollEventTarget(element, rootParent = window) {
let node = element;
while (
node &&
node.tagName !== 'HTML' &&
node.tagName !== 'BODY' &&
node.nodeType === 1 &&
node !== rootParent
) {
const { overflowY } = getComputedStyle(node);
if (overflowY === 'scroll' || overflowY === 'auto') {
return node;
}
node = node.parentNode;
}
return rootParent;
}
export function getScrollTop(element) {
return 'scrollTop' in element ? element.scrollTop : element.pageYOffset;
}
export function setScrollTop(element, value) {
'scrollTop' in element ? (element.scrollTop = value) : element.scrollTo(element.scrollX, value);
}
// get distance from element top to page top
export function getElementTop(element) {
return (element === window ? 0 : element.getBoundingClientRect().top) + getScrollTop(window);
}
export function getVisibleHeight(element) {
return element === window ? element.innerHeight : element.getBoundingClientRect().height;
}

44
packages/utils/scroll.ts Normal file
View File

@ -0,0 +1,44 @@
type ScrollElement = HTMLElement | Window;
// get nearest scroll element
// http://w3help.org/zh-cn/causes/SD9013
// http://stackoverflow.com/questions/17016740/onscroll-function-is-not-working-for-chrome
export function getScrollEventTarget(element: HTMLElement, rootParent: ScrollElement = window) {
let node = element;
while (
node &&
node.tagName !== 'HTML' &&
node.tagName !== 'BODY' &&
node.nodeType === 1 &&
node !== rootParent
) {
const { overflowY } = window.getComputedStyle(node);
if (overflowY === 'scroll' || overflowY === 'auto') {
return node;
}
node = <HTMLElement>node.parentNode;
}
return rootParent;
}
export function getScrollTop(element: ScrollElement): number {
return 'scrollTop' in element ? element.scrollTop : element.pageYOffset;
}
export function setScrollTop(element: ScrollElement, value: number) {
'scrollTop' in element ? (element.scrollTop = value) : element.scrollTo(element.scrollX, value);
}
// get distance from element top to page top
export function getElementTop(element: ScrollElement) {
return (
(element === window ? 0 : (<HTMLElement>element).getBoundingClientRect().top) +
getScrollTop(window)
);
}
export function getVisibleHeight(element: ScrollElement) {
return element === window
? element.innerHeight
: (<HTMLElement>element).getBoundingClientRect().height;
}