mpvue 小程序如何开启下拉刷新,上拉加载?

2018-05-25

https://developers.weixin.qq.com/miniprogram/dev/api/pulldown.html#onpulldownrefresh 小程序API

微信小程序之下拉加载和上拉刷新 微信小程序下拉加载和上拉刷新两种实现方法 方法一:onPullDownRefresh和onReachBottom方法实现小程序下拉加载和上拉刷新

首先要在json文件里设置window属性

属性类型描述
enablePullDownRefreshBoolean是否开启下拉刷新,详见页面相关事件处理函数。

设置js里onPullDownRefresh和onReachBottom方法

属性类型描述
onPullDownRefreshfunction页面相关事件处理函数——监听用户下拉动作
onReachBottomfunction页面上拉触发底事件的处理函数
// 全局开启下拉刷新在最外层的main.js下

 window: {
  enablePullDownRefresh: true,
}

// 局部开启下拉刷新,就在文件下的main.js

export default {
  config: {
    "enablePullDownRefresh": true,
  }
}

// 下拉刷新方法,与methods方法同级

async onPullDownRefresh() {
  // to doing..
  // 停止下拉刷新
  wx.stopPullDownRefresh();
},

// 上拉加载,拉到底部触发
onReachBottom() {
  // 到这底部在这里需要做什么事情
  this.loadMore();
},

我的GitHub博客,很多内容可以看,喜欢的给星星哦 https://github.com/liangfengbo/frontend

原文链接:segmentfault.com

上一篇:mpvue项目里做API与数据分离统一管理
下一篇:移动端本地 H5 秒开方案探索与实现
相关教程
关注微信

扫码加入 JavaScript 社区

相关文章

首次访问,需要验证
微信扫码,关注即可
(仅需验证一次)

欢迎加入 JavaScript 社区

号内回复关键字:

回到顶部