vue监听指定区域的滚动，以及设置滚动值

这个方法适用于顶部固定这种不是全页面在滚动的情况，只需要监听指定的位置滚动就能触发想要的效果。

主要就是用到ref和@scroll

ref 加在普通的元素上，用this.$refs.（ref值） 获取到的是dom元素

@scroll可以监听滚动事件

因为我绑定名字是Box，所以就用这个this.$refs.Box来指定dom进行 *** 作，这里我让他滚回到了顶部。

希望对你有所帮助！

如下所示：

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)

{

//

需要执行的代码

}

}

})

坑：在做滚动加载分页时候，有时候第三方的d窗如elementui

会出问题

，这时候需要watch变量d窗关闭时修改el.scrollTop=0即可。

以上这篇vue

监听某个div垂直滚动条下拉到底部的方法就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。

您可能感兴趣的文章:vue

纯js监听滚动条到底部的实例讲解vue

中滚动条始终定位在底部的方法vue实现动态添加数据滚动条自动滚动到底部的示例代码Vue下滚动到页面底部无限加载数据的示例代码vue监听滚动事件实现滚动监听vue

每次渲染完页面后div的滚动条保持在最底部的方法

---