Browse Source

refactor(im_chat_info): 优化聊天记录加载后的滚动体验

- 移除不必要的 scrollIntoView 和 scrollViewHeight 属性
- 添加 isFirstLoad 和 scrollTop 属性
- 修改加载完成后滚动到底部的逻辑,使用 scrollTop 属性
- 优化代码结构,提高可读性和性能
master
liutong 10 months ago
parent
commit
df2cca374b
  1. 25
      pages/common/im_chat_info.vue

25
pages/common/im_chat_info.vue

@ -6,6 +6,7 @@
<scroll-view <scroll-view
class="section_1" class="section_1"
scroll-y="true" scroll-y="true"
:scroll-top="scrollTop"
:lower-threshold="lowerThreshold" :lower-threshold="lowerThreshold"
style="height: 80vh;" style="height: 80vh;"
> >
@ -90,7 +91,8 @@ export default {
content: '',//JSON ,=,= content: '',//JSON ,=,=
}, },
lastItemId: null, isFirstLoad: true, //
scrollTop:'',
} }
}, },
onLoad(options) { onLoad(options) {
@ -137,16 +139,10 @@ export default {
// //
await this.getList(); await this.getList();
// item ID //
this.lastItemId = 'item_' + (this.tableList.length - 1); if (this.filteredData.page == 2) {
this.scrollToBottom()
// }
this.$nextTick(() => {
this.$refs.scrollView.scrollTo({ top: this.scrollViewHeight });
});
// 使 scroll-into-view
this.scrollIntoView = this.lastItemId;
}, },
// //
@ -303,6 +299,13 @@ export default {
} }
}, },
//
scrollToBottom() {
alert(1)
this.$nextTick(() => {
this.scrollTop = 999999 //
})
},
} }
} }
</script> </script>

Loading…
Cancel
Save