yinchuan-community-all/mini-program/garden-wxapp/components/mescroll-body/mixins/mescroll-more.js

/**
 * mescroll-body写在子组件时, 需通过mescroll的mixins补充子组件缺少的生命周期
 */
const MescrollMoreMixin = {
    data() {
        return {
            tabIndex: 0, // 当前tab下标
            mescroll: {
                onPageScroll: e => {
                    this.handlePageScroll(e)
                },
                onReachBottom: () => {
                    this.handleReachBottom()
                },
                onPullDownRefresh: () => {
                    this.handlePullDownRefresh()
                }
            }
        }
    },
    // 因为子组件无onPageScroll和onReachBottom的页面生命周期，需在页面传递进到子组件
    onPageScroll(e) {
        this.handlePageScroll(e)
    },
    onReachBottom() {
        this.handleReachBottom()
    },
    // 当down的native: true时, 还需传递此方法进到子组件
    onPullDownRefresh() {
        this.handlePullDownRefresh()
    },
    methods: {
        handlePageScroll(e) {
            let mescroll = this.getMescroll(this.tabIndex);
            mescroll && mescroll.onPageScroll(e);
        },
        handleReachBottom() {
            let mescroll = this.getMescroll(this.tabIndex);
            mescroll && mescroll.onReachBottom();
        },
        handlePullDownRefresh() {
            let mescroll = this.getMescroll(this.tabIndex);
            mescroll && mescroll.onPullDownRefresh();
        },
        // 根据下标获取对应子组件的mescroll
        getMescroll(i) {
            if (!this.mescrollItems) this.mescrollItems = [];
            if (!this.mescrollItems[i]) {
                // v-for中的refs
                let vForItem = this.$refs["mescrollItem"];
                if (vForItem) {
                    this.mescrollItems[i] = vForItem[i]
                } else {
                    // 普通的refs,不可重复
                    this.mescrollItems[i] = this.$refs["mescrollItem" + i];
                }
            }
            let item = this.mescrollItems[i]
            return item ? item.mescroll : null
        },
        // 切换tab,恢复滚动条位置
        tabChange(i) {
            let mescroll = this.getMescroll(i);
            if (mescroll) {
                // 延时(比$nextTick靠谱一些),确保元素已渲染
                setTimeout(() => {
                    mescroll.scrollTo(mescroll.getScrollTop(), 0)
                }, 30)
            }
        }
    }
}

export default MescrollMoreMixin;