yyzone/src/mixins/scroll.js

yyzone vue components and utils

import PerfectScrollbar from 'perfect-scrollbar'
export default {
    data() {
        return {
            scroll: null,
            container: null,
            scrollTop: 0
        }
    },
    methods: {
        initScroll(element) {
            this.container = element
            this.scroll = new PerfectScrollbar(this.container, {
                wheelSpeed: 0.5,
                wheelPropagation: false,
                useBothWheelAxes: true,
                minScrollbarLength: 60,
                maxScrollbarLength: 300
            })
            this.container.addEventListener('ps-scroll-y', (e) => {
                this.scrollTop = e && e.target && e.target.scrollTop
            })
        },
        scrollTo(top) { // 滚动到对应位置
            this.container.scrollTop = top
            this.scroll.update()
        },
        updateScroll() {  // 更新滚动条
            this.scroll.update()
        },
        destroyScroll() {
            this.container.removeEventListener('ps-scroll-y')
            this.container = null
            this.scrollTop = 0
            this.scroll = null
        }
    }
}