微信小程序判断页面滑动方向
微信小程序在开发过程中，我们可能会需要判断小程序页面滚动方向是向上，还是向下，那么该如何判断呢，下面小编为大家解答。
微信小程序判断页面滑动方向
解决方案
1.用到微信小程序API
获取页面实际高度nodesRef.boundingClientRect([callback])
监听用户滑动页面事件onPageScroll。
2.获取页面实际高度
/* JS */ // 封装函数获取ID为box的元素实际高度 getScrollHeight: function() { wx.createSelectorQuery().select('#box').boundingClientRect((rect) => { tShopfas.setData({ scrollHeight: rect.height }) console.log(tShopfas.data.scrollHeight) }).exec() }, // 假设数据请求 getDataList: function() { wx.request({ url: 'test.php', //仅为示例，并非真实的接口地址 success: function(res) { // 如果该元素下面的数据是动态获取的，此方法在wx.request请求成功的回调函数中调用 tShopfas.getScrollHeight() } }) },
3.监听用户滑动页面事件
//监听用户滑动页面事件
onPageScroll: function(e) {
if (e.scrollTop tShopfas.data.scrollHeight) {
// 滚动到最底部
e.scrollTop = tShopfas.data.scrollHeight;
}
if (e.scrollTop > tShopfas.data.scrollTop || e.scrollTop >= tShopfas.data.scrollHeight) {
//向下滚动
console.log('向下 ', tShopfas.data.scrollHeight)
} else {
//向上滚动
console.log('向上滚动 ', tShopfas.data.scrollHeight)
}
//给scrollTop重新赋值
tShopfas.setData({
scrollTop: e.scrollTop
})
},
Shopfa小程序工具提供多类型商城/门店小程序制作，可视化编辑 1秒生成5步上线。通过拖拽、拼接模块布局小程序商城页面，所看即所得，只需要美工就能做出精美商城。
第二部分：如何开通一个小商店
****更多行业产品开发方案，请关注 加速度****
<以上资讯仅供参考，如需解决具体问题，建议您关注作者；如果有软件产品开发需求，可在线咨询获取产品开发方案和报价>
小程序开发
小程序商城
微信小程序
加客服微信获取更多内容