vue监听滚动条

　　首先，在mounted钩子中给window添加一个滚动监听事件，

mounted () {
  window.addEventListener('scroll', this.handleScroll)
},

　　然后在方法中，添加这个handleScroll方法，打印scrollTop在控制台中查看需要滚动的大小

handleScroll () {
  var scrollTop = window.pageYOffset || document.documentElement.scrollTop || document.body.scrollTop
  console.log(scrollTop)
},    

 　　添加内容，当滚动条滚动大于100时，top状态改为1

 handleScroll() {
                        var scrollTop =
                                window.pageYOffset ||
                                document.documentElement.scrollTop ||
                                document.body.scrollTop;
                        console.log(scrollTop);
                        if (scrollTop > 100) {
                                this.top = 1;
                        } else {
                                this.top = 0;
                        }
                },　　

　　data return 中定义top初始值为0，

        data() {
                return {
                        top: 0,
                };
        },

　　需要显示的内容上添加：

v-if="top == 1"

 

 

  参照： https://blog.csdn.net/qq_42221334/article/details/80969890?utm_medium=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-6.control&depth_1-utm_source=distribute.pc_relevant.none-task-blog-BlogCommendFromMachineLearnPai2-6.control      这里写的是   实现某元素吸顶或者固定位置显示