pull-refresh.js 1.38 KB
let $ = require('yoho-jquery'),
    IScroll = require('yoho-iscroll/build/iscroll-probe');

// 下拉刷新,上滑加载插件
// 参数一选择器,参数二选项
// height:容器高度
// pullDown:下拉回调
// pullUp:上滑回调
// 示例代码:
// new PullRefresh('.star-wrap', {
//     height: $(window).height() - $('#yoho-header').height() - $('.head-tab').height(),
//     pullDown: function() {
//         console.log('下拉了');
//     },
//     pullUp: function() {
//         console.log('上滑了');
//     }
// });

function PullRefresh(seclector, options) {
    let $window = $(window),
        $em,
        pullFormTop = false,
        pullStart;

    $em = $(seclector);

    if (!$em.length) {
        return;
    }

    this.iScroll = new IScroll($em.get(0), $.extend({
        click: true,
        probeType: 2
    }, options));

    this.iScroll.on('scrollStart', function() {
        if (this.y === 0) {
            pullFormTop = true;
        }

        pullStart = this.y;
    });

    this.iScroll.on('scrollEnd', function() {
        if (pullFormTop && this.directionY === -1) {
            options.pullDown && options.pullDown();
        }
        pullFormTop = false;

        if (pullStart === this.y && this.directionY === 1) {
            options.pullUp && options.pullUp();
        }

        $window.trigger('scroll');
    });
}

module.exports = PullRefresh;