scrollToBottom() {
	var div=this.$refs.scrollDiv;
	div.scrollTop = div.scrollHeight;
                                    要制作一个在线聊天的程序,在做最后的修饰时,需要对获得的信息即时滚动以保证用户总能看到最新消息。
聊天程序是基于AJAX设计的,没有用框架,消息容器是一个DIV,所以问题就在于如何控制DIV滚动条。
但同样的代码拿到我这里却完全失效,又仔细查了下资料说XHTML标准下scrollTop的值恒为0,解决办法是使用 document.documentElement.scrollTop代替document.body.scrollTop,讲了半天所解决的是整个页 面的滚动条。这个方法我是用不了了,因为不是框架结构,所以不可能用body的滚动条控制浏览信息。
网上关于这个问题的资料很少,连CSDN上也
现在我们来了解几个dom属性:
scrollTop:获取或设置一个元素的内容垂直滚动的像素数,当一个元素的内容没有产生垂直方向的滚动条,那么它的 scrollTop 值为0
scrollHeight:这是一个只读属性,是元素内容高度的度量,...
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) {
// 需要执行的代码
坑:在做滚动加载分页时候,有时候第三
	<meta charset="UTF-8">
	<meta name="viewport" content="width=device-width, initial-scale=1.0">
	<meta http-equiv="X-UA-Compatible" content="ie=edge">
	<title></title>.
                                    研究了一个插件 列表自动滚动的插件vue-seamless-scroll。如图所示可以看到 它自动向上滚动 以及鼠标移动进入表格则停止滚动。感受这是个做大屏可视化时可靠帮手。/* 表格内背景颜色 */
this.$nextTick(() => {
    let middle= _this.$refs["middle"];
    middle.scrollTop = middle.scrollHeight;
&lt;head&gt;
    &lt;meta charset="UTF-8"&gt;
    &lt;meta name="viewport" content="width=device-width, initial-scale=1.
                                    当后端给我们一个分页获取数据的接口时,我们前端可以通过设置分页按钮来获取到所有的数据,也可以通过判断滚动条位置,当滚动条滚动底部时就发送请求获取下一页的数据,这样我们就可以不设置分页按钮也能获取到所有的数据。