MarxJiao / vue-iscroll-directive

vue iscroll 指令
MIT License
30 stars 13 forks source link

要下拉刷新加载数据应该怎么做? #6

Closed ytd7777 closed 7 years ago

ytd7777 commented 7 years ago

需要用到这个滚动事件 scrollStart scroll scrollEnd 来完成下拉加载数据,你这个应该怎么写?

MarxJiao commented 7 years ago

暂时不能添加事件绑定。

急用的话,拷贝源码在vnode.scroll = new IScroll(el, iscrollOptions)后面加vnode.scroll.on()

var IScroll =  require('iscroll');

var VIScroll = {
    install: function (Vue, options) {
        Vue.directive('iscroll', {
            inserted: function (el, binding, vnode, oldVnode) {

                // 判断输入参数
                var vtype = binding.value ? [].toString.call(binding.value) : undefined;

                // 设置iscorll属性的参数
                var iscrollOptions  = vtype === '[object Object]' ? binding.value : options;

                // 使用vnode绑定iscroll是为了让iscroll对象能够夸状态传递,避免iscroll重复建立
                vnode.scroll = new IScroll(el, iscrollOptions);

                /**
                 * 这里可添加事件绑定
                 */
            },
            componentUpdated: function (el, binding, vnode, oldVnode) {

                // 将scroll绑定到新的vnode上
                vnode.scroll = oldVnode.scroll;

                // 使用settimeout让refresh跳到事件流结尾,保证refresh时数据已经更新完毕
                vnode.scroll.refresh();
            },
            unbind: function (el, binding, vnode, oldVnode) {

                /**
                 * 解除绑定时要把iscroll销毁
                 */
                vnode.scroll = oldVnode.scroll;
                vnode.scroll.destroy();
                vnode.scroll = null;
            }
        })
    }
}

module.exports = VIScroll;
Ivorzk commented 7 years ago

我也遇到同样的问题,希望能得到解决!

Ivorzk commented 7 years ago

能在组件外部调用到iscroll实例并进行监听不!我有嵌套的viscroll 需要阻止事件冒泡的!

MarxJiao commented 7 years ago

指令更新了版本 1.1.0,现在可以把函数赋给指令,函数的参数是当前iscroll的实例,可以做事件监听等操作,希望能解决你们的问题。使用的话可以参考readme和这个:https://github.com/MarxJiao/viscroll-demo/blob/master/src/components/Demo2.vue