美文网首页工作生活
下拉刷新与上拉加载更多

下拉刷新与上拉加载更多

作者: __笑我一世沉沦丶 | 来源:发表于2019-07-30 10:58 被阅读0次
  • 下拉刷新

1、在所需要操作的json文件中添加

{
  "enablePullDownRefresh":true
}

添加了之后就可以向下拖动上方留白的效果
2、给下拉留白区添加颜色以及过渡效果
在app.json文件的window中添加以下内容

"window": {
   "backgroundColor":"#f01450",
}
image.png

即可出现以上效果
3、在js文件中添加监听函数

  onPullDownRefresh(){
    wx.showNavigationBarLoading()
    setTimeout(function () {
      wx.hideNavigationBarLoading() //完成停止加载
      wx.stopPullDownRefresh() //停止下拉刷新
    }, 1500);
  },
  • wx.showNavigationBarLoading()业务办理左侧出现转圈效果
  • wx.hideNavigationBarLoading()停止转圈效果
  • wx.stopPullDownRefresh()收回下拉效果
  • 下拉加载更多

onReachBottom函数中执行相关的代码

相关文章

网友评论

    本文标题:下拉刷新与上拉加载更多

    本文链接:https://www.haomeiwen.com/subject/aczacctx.html