vue 监听某个div垂直滚动条下拉到底部的方法


Posted in Javascript onSeptember 15, 2018

如下所示:

this.$nextTick(() => {
const el = document.querySelector('.act-not');
const offsetHeight = el.offsetHeight;
el.onscroll = () => {
const scrollTop = el.scrollTop;
const scrollHeight = el.scrollHeight;
if ((offsetHeight + scrollTop) - scrollHeight >= -1) {
// 需要执行的代码
}
};
});

坑:在做滚动加载分页时候,有时候第三方的弹窗如elementui 会出问题 ,这时候需要watch变量弹窗关闭时修改el.scrollTop=0即可。

以上这篇vue 监听某个div垂直滚动条下拉到底部的方法就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在IE中调用javascript打开Excel的代码(downmoon原作)
Apr 02 Javascript
javaScript call 函数的用法说明
Apr 09 Javascript
jquery插件珍藏(图片局部放大/信息提示框)
Jan 08 Javascript
JavaScript开发人员的10个关键习惯小结
Dec 05 Javascript
javascript实现在指定元素中垂直水平居中
Sep 13 Javascript
jQuery 监控键盘一段时间没输入
Apr 22 Javascript
基于jquery实现最简单的选项卡切换效果
May 08 Javascript
jQuery文字横向滚动效果的实现代码
May 31 Javascript
AngularJS ng-controller 指令简单实例
Aug 01 Javascript
js表单登陆验证示例
Oct 19 Javascript
jQuery实现优雅的弹窗效果(6)
Feb 08 Javascript
利用vscode编写vue的简单配置详解
Jun 17 Javascript
vue--点击当前增加class,其他删除class的方法
Sep 15 #Javascript
vue-cli 使用vue-bus来全局控制的实例讲解
Sep 15 #Javascript
在vue中实现点击选择框阻止弹出层消失的方法
Sep 15 #Javascript
对vue下点击事件传参和不传参的区别详解
Sep 15 #Javascript
vue-cli webpack 引入swiper的操作方法
Sep 15 #Javascript
swiper在vue项目中loop循环轮播失效的解决方法
Sep 15 #Javascript
解决vue中虚拟dom,无法实时更新的问题
Sep 15 #Javascript
You might like
php面向对象全攻略 (五) 封装性
2009/09/30 PHP
destoon实现调用当前栏目分类及子分类和三级分类的方法
2014/08/21 PHP
PHP中实现接收多个name相同但Value不相同表单数据实例
2015/02/03 PHP
适用于初学者的简易PHP文件上传类
2015/10/29 PHP
php实现zip文件解压操作
2015/11/03 PHP
给WordPress中的留言加上楼层号的PHP代码实例
2015/12/14 PHP
jQuery 获取URL参数的插件
2010/03/04 Javascript
用js实现的自定义的对话框的实现代码
2010/03/21 Javascript
JavaScript代码复用模式实例分析
2012/12/02 Javascript
JavaScript中获取样式的原生方法小结
2014/10/08 Javascript
JavaScript实现cookie的写入、读取、删除功能
2015/11/05 Javascript
通过node-mysql搭建Windows+Node.js+MySQL环境的教程
2016/03/01 Javascript
jquery.Callbacks的实现详解
2016/11/30 Javascript
BootStrap selectpicker后台动态绑定数据的方法
2017/07/28 Javascript
vue一个页面实现音乐播放器的示例
2018/02/06 Javascript
[01:14:35]DOTA2上海特级锦标赛B组资格赛#1 Alliance VS Fnatic第一局
2016/02/26 DOTA
理解Python中函数的参数
2015/04/27 Python
Python中的四种交换数值的方法解析
2019/11/18 Python
python中的subprocess.Popen()使用详解
2019/12/25 Python
基于Pycharm加载多个项目过程图解
2020/01/19 Python
python实现微信打飞机游戏
2020/03/24 Python
使用Keras中的ImageDataGenerator进行批次读图方式
2020/06/17 Python
python 制作简单的音乐播放器
2020/11/25 Python
python 基于opencv去除图片阴影
2021/01/26 Python
利用CSS3的border-radius绘制太极及爱心图案示例
2016/05/17 HTML / CSS
改变生活的男士内衣:SAXX Underwear
2019/08/28 全球购物
计算机开发个人求职信范文
2013/09/26 职场文书
大学生创业计划书的格式要求
2013/12/29 职场文书
syb养殖创业计划书
2014/01/09 职场文书
庆七一活动方案
2014/01/25 职场文书
文明风采获奖感言
2014/02/18 职场文书
股份转让协议书
2014/04/12 职场文书
2014个人反腐倡廉思想汇报
2014/09/15 职场文书
责任书范本大全
2015/05/11 职场文书
2016教师国培研修感言
2015/12/08 职场文书
CSS实现两列布局的N种方法
2021/08/02 HTML / CSS