iView中的无限滚动Scroll组件滚动条如何保持沉在底部

Question

问题描述

使用iview的无限滚动组件Scroll，无法实现聊天页面滚动条一直沉在底部

问题出现的环境背景及自己尝试过哪些方法

尝试解决：

1. 下面两种都无效
   watch: {
   chat_content_list() {

   this.$nextTick(() => {
   var chatScroll = this.$refs.chatScroll
   chatScroll.scrollTop = chatScroll.height;
   console.log('chatScroll.scrollTop',chatScroll.scrollTop,'chatScroll.height',chatScroll.height);
   console.log('chatScrollchatScroll',chatScroll);
   
   // document.getElementById('chatid').scrollTop = document.getElementById('chatid').scrollHeight;
   // console.log('chatid.scrollTop',document.getElementById('chatid').scrollTop,'chatid.scrollHeight',document.getElementById('chatid').scrollHeight);

   })
   }
   },

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）
<Scroll :on-reach-top="handleReachTop" :height="chat_height" ref="chatScroll" id="chatid">

你期待的结果是什么？实际看到的错误信息又是什么？

期待看到的结果是获取聊天的内容的时候，滚动条是沉在底部，发送新的信息或者收到新的信息的时候，滚动条自动滚到底部

Answer 1

我也遇到这个问题