微信小程序

小程序里如何使页面自动滚动到底部?

2018-05-16  本文已影响34人  杀个程序猿祭天

原链接: https://segmentfault.com/q/1010000012493589

在更新数据后,以及初次进入页面,希望页面停留在最底部;

因为内容中有video,不能使用scroll-view来实现,看页面有监听滚动的函数,但没有控制滚动的,那么,怎样可以实现呢?

// 获取容器高度,使页面滚动到容器底部

  pageScrollToBottom: function() {

    wx.createSelectorQuery().select('#j_page').boundingClientRect(function(rect){

      // 使页面滚动到底部

      wx.pageScrollTo({

        scrollTop: rect.bottom

      })

    }).exec()

  },

j_page为页面容器的id

使用rect.bottom, rect.height均能达到滚动到底部的效果

在数据更新后(setData回调函数)使用

相关api文档:

https://mp.weixin.qq.com/debug/wxadoc/dev/api/scroll.html

https://mp.weixin.qq.com/debug/wxadoc/dev/api/wxml-nodes-info.html#nodesrefboundingclientrectcallback

上一篇下一篇

猜你喜欢

热点阅读