微信小程序,获取scrollview元素当前的scrolltop,不通过监听scroll
时间: 2024-12-18 08:29:43 浏览: 15
微信小程序中,如果你想要获取`scroll-view`元素的滚动位置(scrollTop),而不想直接监听滚动事件(`wx:scroll`),你可以通过使用小程序提供的API间接获取。首先,你需要在页面的`data`对象中定义一个变量来保存滚动值:
```javascript
Page({
data: {
scrollViewScrollTop: 0,
},
// 其他生命周期函数...
})
```
然后,在你想获取滚动位置的地方,可以调用`getBoundingClientRect()`方法,这个方法会返回元素相对于视口的位置信息。注意,由于微信小程序的限制,可能需要在`onLoad`或适当的时候手动获取并更新滚动值:
```javascript
onLoad: function() {
this.updateScrollViewScrollTop();
},
updateScrollViewScrollTop: function() {
let scrollView = wx.createSelectorQuery().select('#your-scroll-view-id').fields({
node: true,
}).exec()[0];
if (scrollView) {
this.setData({
scrollViewScrollTop: scrollView.scrollTop || 0, // 如果没有scrollTop属性,设置为0
});
}
}
```
在这个例子中,`#your-scroll-view-id`需要替换为你实际`scroll-view`组件的id。每次页面加载完成或滚动结束后,可以调用`updateScrollViewScrollTop`方法来刷新滚动位置。
阅读全文