yd-tab里面使用下拉刷新+滚动加载方法

[git0x4c]

问题描述

【这不是提bug】 tab里面使用下拉刷新+滚动加载在作者的案例里得不到很好的解决(也许是我的使用方法不对)，于是我利用原生js监听滚动条实现滚动加载效果，希望能给需要的人提供一种方案

产生环境

• **使用版本：1.2.6
• **引入方式：NPM
• **演示地址：-

代码区域

<yd-tab v-model="tab_active"  active-color="#3DABF3" :callback="changeTab">
    <yd-tab-panel label="测试">
        <div class="list">
            <yd-pullrefresh :callback="getList" ref="pullrefresh">
                <div class="item">your dom</item>
            </yd-pullrefresh>
        </div>
    </yd-tab-panel>
</yd-tab>

// methods:
onScroll () {
    //变量scrollTop是滚动条滚动时，距离顶部的距离
    var scrollTop = document.documentElement.scrollTop||document.body.scrollTop;
    //变量windowHeight是可视区的高度
    var windowHeight = document.documentElement.clientHeight || document.body.clientHeight;
    //变量scrollHeight是滚动条的总高度
    var scrollHeight = document.documentElement.scrollHeight||document.body.scrollHeight;
    //滚动条到底部的条件
    // console.log(scrollTop, windowHeight, scrollHeight)
    if(scrollTop + windowHeight == scrollHeight){
        //写后台加载数据的函数
     }
},
removeScroll() {
    window.removeEventListener('scroll', this.onScroll, false);// 去除监听
}

// mounted
this.$nextTick(function () {
    window.addEventListener('scroll', this.onScroll, false)//监听页面滚动事件
})

// 销毁滚动监听 与data同级
beforeDestroy(){
    // console.log('beforeDestroy')
    this.removeScroll()
},
destroyed() {
    // console.log('destroyed')
    this.removeScroll()
}