vue监听scroll的坑的解决方法


Posted in Javascript onSeptember 07, 2017

最近开始用vue写个小项目,踩了不少坑,这里记录下爬坑过程,给有同样经历的人帮助。

问题

今天想在vue的项目里面用下拉加载,然后就直接写了:

vue监听scroll的坑的解决方法

但是我发现我切换路由以后依旧其他页面也触发了scrollHandler函数,然后我想到使用了vue-router做的spa项目,window对象不变的,所以需要在每次使用后销毁。

解决办法

我回去看了下vue文档的生命周期,看到了destroyed,然后直接在这个周期内销毁就可以了。

vue监听scroll的坑的解决方法

使用throttle出现的新问题

下拉加载一般需要配合throttle限流函数(原理可以看这里)来避免频繁触发,所以优化代码成这样:

vue监听scroll的坑的解决方法

然后发现没法用removeEventListener了,因为这个函数第二个参数不接受匿名函数。

最后代码

用一个变量中转下

vue监听scroll的坑的解决方法

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
比较全面的event对像在IE与FF中的区别 推荐
Sep 21 Javascript
jQuery 处理网页内容的实现代码
Feb 15 Javascript
用unescape反编码得出汉字示例
Apr 24 Javascript
javascript实现的HashMap类代码
Jun 27 Javascript
一起学写js Calender日历控件
Apr 14 Javascript
详解JavaScript对象类型
Jun 16 Javascript
微信小程序登录态控制深入分析
Apr 12 Javascript
[js高手之路]HTML标签解释成DOM节点的实现方法
Aug 31 Javascript
详解javascript 正则表达式之分组与前瞻匹配
May 30 Javascript
如何使用proxy实现一个简单完整的MVVM库的示例代码
Sep 17 Javascript
JavaScript实现多文件下载方法解析
Aug 07 Javascript
js Proxy的原理详解
May 25 Javascript
react高阶组件经典应用之权限控制详解
Sep 07 #Javascript
React + webpack 环境配置的方法步骤
Sep 07 #Javascript
微信小程序之页面拦截器的示例代码
Sep 07 #Javascript
基于js粘贴事件paste简单解析以及遇到的坑
Sep 07 #Javascript
微信小程序实现轮播图效果
Sep 07 #Javascript
使用mint-ui开发项目的一些心得(分享)
Sep 07 #Javascript
JavaScript+CSS相册特效实例代码
Sep 07 #Javascript
You might like
PHP图片等比缩放类SimpleImage使用方法和使用实例分享
2014/04/10 PHP
php学习笔记之基础知识
2014/11/08 PHP
php将从数据库中获得的数据转换成json格式并输出的方法
2018/08/21 PHP
PHP常用字符串输出方法分析(echo,print,printf及sprintf)
2021/03/09 PHP
setTimeout和setInterval的区别你真的了解吗?
2011/03/31 Javascript
JQuery中使文本框获得焦点的方法实例分析
2015/02/28 Javascript
轻松使用jQuery双向select控件Bootstrap Dual Listbox
2015/12/13 Javascript
JS获取时间的相关函数及时间戳与时间日期之间的转换
2016/02/04 Javascript
JS中substring与substr的用法
2016/11/16 Javascript
JavaScript异步上传图片文件的实例代码
2017/07/04 Javascript
hammer.js实现图片手势放大效果
2017/08/29 Javascript
vue使用技巧及vue项目中遇到的问题
2018/06/04 Javascript
微信小程序实现折叠与展开文章功能
2018/06/12 Javascript
js实现简单选项卡制作
2020/08/05 Javascript
解决Python requests 报错方法集锦
2017/03/19 Python
使用tensorflow实现AlexNet
2017/11/20 Python
pycharm 安装JPype的教程
2019/08/08 Python
PyQt+socket实现远程操作服务器的方法示例
2019/08/22 Python
python 调用pyautogui 实时获取鼠标的位置、移动鼠标的方法
2019/08/27 Python
浅谈tensorflow中Dataset图片的批量读取及维度的操作详解
2020/01/20 Python
CSS+jQuery+PHP+MySQL实现的在线答题功能
2015/04/25 HTML / CSS
CSS3中引入多种自定义字体font-face
2020/06/12 HTML / CSS
英国在线电子和小工具商店:TecoBuy
2018/10/06 全球购物
澳大利亚有机化妆品网上商店:The Well Store
2020/02/20 全球购物
RIP版本1跟版本2的区别
2013/12/30 面试题
为什么需要版本控制
2016/10/28 面试题
土木工程毕业生自荐信
2013/11/12 职场文书
会计自荐书
2013/12/02 职场文书
幼儿园中班新学期寄语
2014/01/18 职场文书
小学庆六一活动方案
2014/02/28 职场文书
应届生自荐书
2014/06/23 职场文书
施工单位工程部经理岗位职责
2015/04/09 职场文书
2015年导购员工作总结
2015/04/25 职场文书
暑假打工感想
2015/08/07 职场文书
安全教育的主题班会
2015/08/13 职场文书
通过Qt连接OpenGauss数据库的详细教程
2021/06/23 PostgreSQL