data_dashboards/datadas/mydatadas/src/common/rollTolls.js

/*jshint esversion: 9 */
/*
 * 简单的页面滚动工具 一篇文字
 */

/**
 * 从开始的位置移动到结束的位置（匀速，固定时间）
 */
export function simpleRoll(params = {}) {
    let top = undefined;
    let left = undefined;
    /** 如果不传值则不做处理top位置 */
    if (params.hasOwnProperty('top')) {
        top = Number(params.top) || 0;
    }
    if (params.hasOwnProperty('left')) {
        left = Number(params.left) || 0;
    }
    let time = Number(params.time) || 0;
    let target = params.target;
    if (!target) {
        console.warn('请传入滚动容器元素');
        return;
    }
    let hasLeft = left !== undefined;
    let hasTop = top !== undefined;
    if (!hasLeft && !hasTop) {
        console.warn('请传入top || left值');
        return;
    }
    let startTime = Date.now();
    let scrollTop = target.scrollTop || 0;
    let scrollLeft = target.scrollLeft || 0;
    let lengthY = top - scrollTop;
    let lengthX = left - scrollLeft;
    requestAnimationFrame(function func() {
        /** 时间进度 */
        let schedule = (Date.now() - startTime) / time;
        // 到达指定时间了，停止执行
        if (schedule >= 1) {
            if (hasLeft) {
                target.scrollLeft = lengthX + scrollLeft;
            }
            if (hasTop) {
                target.scrollTop = lengthY + scrollTop;
            }
            return;
        }
        /** 此时的位置 */
        if (hasTop) {
            target.scrollTop = lengthY * schedule + scrollTop;
        }
        if (hasLeft) {
            target.scrollLeft = lengthX * schedule + scrollLeft;
        }
        requestAnimationFrame(func);
    });
}