js实现下拉加载

上拉加载失效

在麦芒6遇到这个问题。看了一下代码，发现是性能问题，监听scroll事件需要函数截流。

解决方法

下拉加载代码

$(window).on('scroll', Util.debounce(this.upperLoad.bind(this), 20));
// 上拉加载
    upperLoad() {
        let $win = $(window);
        let $doc = $(document);
        let winH = $win.height();

        if (this.props.loading || this.props.loading === null) {
            return false;
        }

        let scrollTop = $win.scrollTop();

        let docH = $doc.height();

        if (scrollTop + winH >= docH) {
            this.props.handleNext && this.props.handleNext();
        }
    }
复制代码

消抖函数

export const debounce = (fun, delay) => {
    var last;
    return function () {
        var ctx = this;
        var args = arguments;
        clearTimeout(last);
        last = setTimeout(function () {
            fun.apply(ctx, args);
        }, delay);
    };
};
复制代码