我正在尝试创建一个聊天应用程序。每次用户发送新消息时，新消息都会附加到 ul 消息列表中。我已经使 UL 列表可滚动，并且它正在超时滚动，我发送一条消息；但是它并没有一直滚动到底部。仅供引用:我正在使用 Vue.js
这是当前代码:
this.messages.push(this.currentMessage) //adding new message to the list
var div = document.getElementById('chat-list-ul');
div.scrollTop = div.scrollHeight;
不知何故，它只是滚动到底部之前的一行。做了一些测试，我发现这可能是由于滚动函数调用太快造成的，因为如果我插入 1 秒的超时，它就会正确滚动。
我的问题是:有没有办法为 array.push() 函数创建一个 promise ，让我仅在数组更新为新值后才调用滚动方法？
谢谢，
最佳答案
您可以使用Vue.nextTick(callback)推送新消息后等待 DOM 更新后再触发滚动。像这样的东西..
this.messages.push(this.currentMessage) //adding new message to the list
Vue.nextTick(function () {
var div = document.getElementById('chat-list-ul');
div.scrollTop = div.scrollHeight;
})
关于javascript - 如何同步滚动到 div 底部(聊天)，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/53128051/