微信小程序——滚动到最底部

最近在做个直播间,有个这样的需要,就是进入到页面,<scroll-view>需要滚动到最底部,并且发送消息之后自动的滚动到底部。

微信小程序——<scroll-view>滚动到最底部

开始想着计算里面内容的高度,然后通过设置 scroll-top 的值,达到这个效果。在网上搜一圈,大多也是采取的这种方案。但是感觉这个方案略麻烦。想另寻一条解决方案。

后面看官方文档有个scroll-into-view的属性,如下图:

微信小程序——<scroll-view>滚动到最底部

想着,滚动到底部不就是滚动到最后一条数据嘛~遍历数据的时候给每条数据添加一个id,设置scroll-into-view的值为最后一条数据的id不就可以了嘛~如下图:

微信小程序——<scroll-view>滚动到最底部

至于这个id可以利用好索引,它最后一条数据的id就是所有数据的length-1了。我是直接在索引上+1的。如下图:

微信小程序——<scroll-view>滚动到最底部

页面进入时滚动到底部:

微信小程序——<scroll-view>滚动到最底部

接收消息的滚动到底部代码截图:

productDiscussionList表示会话列表的数据。

微信小程序——<scroll-view>滚动到最底部

上一篇:Android中GridView滚动到底部加载数据终极版


下一篇:scrollView滚动原理