需要注意修改class .cu-chat?為你的頁面聊天框外層class，需要在控制臺審查元素有高度。

代碼：

?this.$nextTick(function() {
?? ??? ??? ??? ??? ?setTimeout(()=>{
?? ??? ??? ??? ??? ??? ?uni.createSelectorQuery().select('.cu-chat').boundingClientRect((res)=>{
?? ??? ??? ??? ??? ??? ??? ?uni.pageScrollTo({
?? ??? ??? ??? ??? ??? ??? ??? ?scrollTop: res.height,
?? ??? ??? ??? ??? ??? ??? ??? ?duration: 200
?? ??? ??? ??? ??? ??? ??? ?})
?? ??? ??? ??? ??? ??? ?}).exec()
?? ??? ??? ??? ??? ?},50)
?? ??? ??? ??? ??? ?
?? ??? ??? ??? ?});

this.$nextTick(function() {setTimeout(()=>{uni.createSelectorQuery().select('.cu-chat').boundingClientRect((res)=>{uni.pageScrollTo({scrollTop: res.height,duration: 200})}).exec()},50)});

?ps:

1.使用this.$nextTick方法來延遲獲取高度。

2.使用setTimeout防止不生效，并且會有一個聊天延遲發(fā)送出來的效果，比瞬間出來個人感覺會更好一點。

總結

以上是生活随笔為你收集整理的uniapp聊天框滚动到底部（简单高效）的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網(wǎng)站內容還不錯，歡迎將生活随笔推薦給好友。