VUE监听滚动事件

前言

今天想作一个效果，当页面滚动到必定距离的时候，图标出现。可是发现用window.addEventListener('scroll',event)居然不生效，网上搜索了很久也没解决。 到各类尝试以后发现这个方法有效，可是仍是不清楚缘由是什么，哎呦脑瓜子疼~

解决

直接上代码

mounted() {
        this.box = this.$refs.surveyMainRef  
        this.box.addEventListener('scroll', this.handleScroll)
    },
    destroyed() {
        window.removeEventListener('scroll', this.handleScroll)
    },
    methods: {
        handleScroll() {
            var scrollTop = this.box.pageYOffset || this.box.scrollTop || 0
            console.log(scrollTop, 'scrollTop')
            if (scrollTop > 300) {
                this.isShowToTop = true
            } else {
                this.isShowToTop = false
            }
        },
    }
复制代码

哪一个滚动就监听哪一个元素的滚动事件， 在浏览器上能够看到有效果