vue监听scroll使用报错的解决办法

错误说明:在切换路由以后,依旧在其他页面触发了scroll有关的函数,

错误原因:在spa项目中,window对象是不变的,所以每次使用后需要销毁。

解决办法:vue的生命周期destroyed中销毁就可以了

 

js方法封装:

export default {
  //移动端iframe缩略图滚动后固定定位
  iframeScroll:{
    scrollFun:function(){   //滚动执行的方法
      var top = $(document).scrollTop();
      if(top >=95){
        $(".step_global .iframe_box").addClass("fixed");
      }else{
        $(".step_global .iframe_box").removeClass("fixed");
      }
    },
    fixed:function(){
      window.addEventListener('scroll',this.scrollFun);
    },
    //window.scroll需要销毁
    destroy:function(){
      window.removeEventListener('scroll',this.scrollFun)
    }
  },



}

引入:

import common from '../../script/common';

 

使用:

mounted(){
    common.iframeScroll.fixed();
  },
  destroyed(){
    common.iframeScroll.destroy();
  },

 

转载于:https://www.cnblogs.com/LChenglong/p/8134717.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值