1、template部分
<div class="messageList" @wheel="handleWheel">
<SmallLoading class="justify-end" v-if="isLoading"></SmallLoading>
<el-scrollbar :always="true" ref="scrollbarRef">
<div ref="innerRef">
//循环的数据
</div>
</el-scrollbar>
</div>
2、script部分
const scrollbarRef = ref(null)
const innerRef = ref()
//滚动到最底部
const scrollToBottom = () => {
if (scrollbarRef.value && innerRef.value) {
scrollbarRef.value.setScrollTop(innerRef.value.clientHeight)
}
}
//监听消息列表
watch(messageList, () => {
nextTick(() => {
scrollToBottom()
})
})