vue 项目添加滚动监听事件

代码如下

<template>
    <div>
        <p v-for="index in 100" :key="index">滚动监听</p>
    </div>
</template>
<script>
export default {
    methods: {
        scrollMethod() {
            console.log('滚动监听')
            console.log(document.documentElement.scrollTop)
        }
    },
    mounted() {
        // 挂载时,添加监听滚动事件,然后用 scrollMethod 方法进行处理
        window.addEventListener('scroll',this.scrollMethod) 
    },
    destroyed() {
        // 销毁时,删除监听滚动事件,否则其他.vue文件也会受影响
        window.removeEventListener('scroll',this.scrollMethod)
    }
}
</script>

运行效果

发布了244 篇原创文章 · 获赞 109 · 访问量 44万+

猜你喜欢

转载自blog.csdn.net/wsjzzcbq/article/details/103711725
今日推荐