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

发布时间:2019-06-12 发布网站:脚本宝典
脚本宝典收集整理的这篇文章主要介绍了mpvue 小程序如何开启下拉刷新,上拉加载?脚本宝典觉得挺不错的,现在分享给大家,也给大家做个参考。

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

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

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

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

设置js里onPullDownRefresh和onReachBottom方法

属性 类型           描述
onPullDownRefresh function 页面相关事件处理函数——监听用户下拉动作
onReachBottom function 页面上拉触发底事件的处理函数
// 全局开启下拉刷新在最外层的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

脚本宝典总结

以上是脚本宝典为你收集整理的mpvue 小程序如何开启下拉刷新,上拉加载?全部内容,希望文章能够帮你解决mpvue 小程序如何开启下拉刷新,上拉加载?所遇到的问题。

如果觉得脚本宝典网站内容还不错,欢迎将脚本宝典推荐好友。

本图文内容来源于网友网络收集整理提供,作为学习参考使用,版权属于原作者。
如您有任何意见或建议可联系处理。小编QQ:384754419,请注明来意。