# uni-app实现聊天记录下拉加载更多,滚动条划到顶部加载数据后仍停留在上次浏览的位置
·
uni-app实现聊天记录下拉加载更多,滚动条划到顶部加载数据后仍停留在上次浏览的位置
最近在做一个类似微信聊天的功能,发现每次到顶部下拉加载新数据后,并不会停留在你浏览到的位置而是直接跳到整个聊天的顶部,显然这不是我们想要的结果,如何在下拉加载数据后停留在当前位置呢?我这里使用的是scroll-view+计算高度的方法实现的,如下图



在触发滚动事件@scroll时,执行scroll函数计算出当前聊天可滚动区域的高度,保存到newheight里;在触顶时触发@scrolltoupper,执行请求数据的方法并重新计算scrollTop,注意,这里重新计算高度一定要放在$nextTick里,否则会计算出未更新dom前的高度。
还有就是第一次进入聊天对话,直接定位到底部,也可以使用计算高度来实现,非常简单就不多解释了,看图(我的fBtn就是底部的输入框,letterList是聊天区域的就高度)
更多推荐


所有评论(0)