微信小程序——下拉刷新

来源：互联网发布：猫罐头推荐知乎编辑：程序博客网时间：2024/04/29 04:50

0x00 scroll-view

用 scroll-view 中的 bindscrolltoupper 实现下拉刷新

this.setData({  pageindex: 0,  loading: false,  loadingComplete: false,  haveStars: true,  stars: []});this.getStarData();

0x01 onPullDownRefresh

在 Page 中定义 onPullDownRefresh 处理函数，监听该页面用户下拉刷新事件。

需要在 config 的 window 选项中开启 enablePullDownRefresh。
当处理完数据刷新后，wx.stopPullDownRefresh 可以停止当前页面的下拉刷新。

ps: 不知道为什么没有触发成功，可能要写进某个 bind 里面吧。

0x02 震惊！

upper-threshold 和 lower-threshold 居然可以设置负数！

这样的话把代码改成

<scroll-view class="scroll-stars" style="height:{{windowHeight}}rpx" upper-threshold="-100" lower-threshold="-50" scroll-y="true" bindscrolltolower="handleLower" bindscrolltoupper="handleUpper">    ...</scroll-view>

就不用忍受刚好碰到顶就触发刷新的 p 事了。

nice! 下拉刷新搞定。

0 0