scroll-view 如何跳转滚动区域底部?
发布于 6 年前 作者 changwei 9934 次浏览 来自 问答

我在做了个聊天页面中使用了个 scroll-view 作为聊天信息的展示,当进入聊天页面时候想像微信一样最后的聊天信息能够展示在聊天输入一起的底部,当我拉动滚动条翻看前面的信息后在输入,想保持插入新的信息放在底部正常显示,想清楚如何实现,普通网页是逻辑清楚的,小程序里没思路望高手指导,谢谢!

5 回复

给每一个聊天信息一个唯一的id。

然后设置scroll-view的属性scroll-into-view="{{sid}}"

每次发送/收到消息生成聊天信息后把生成的最新的id值setData给sid

scroll-view   有一个属性 height 设置以后就可以

@ 3楼

我大致理解了 scroll-into-view 的用意了,我尝试了下做了处理 好像没起作用,帮忙看下我理解的是否正确?

__wxml__里我做了 <scroll-view scroll-y=“true” class=“ChatBox” scroll-into-view="{{toView}}"> toView 设置

<view class=“chat” data-type=“0” id=“c2379437”> 这个为内部元素设置了个id且唯一的

js

data:{

toView: “c2379437”

},


有具体的js代码供参考吗?

@3

好像有变化 就是不是在最底部,如果不在底部新发的聊天信息会被遮挡,有什么方法完善吗?

回到顶部