微信小程序下拉刷新界面

利用onPullDownRefresh函数设置下拉刷新功能

一、在app.json中,将window选项中的enablePullDownRefresh设为true

    "window":{
         "enablePullDownRefresh":true
    }

      或者在要刷新的界面的XXX.json中设置 enablePullDownRefresh设为true    

   {
      "enablePullDownRefresh": true
   }

二、利用onPullDownRefresh函数定义下拉动作并结合wx.request()向后台请求数据更新

   // 下拉刷新
   onPullDownRefresh:function(){
    // 动态设置导航条标题
    wx.setNavigationBarTitle({
      title: ''
    });
    wx.showNavigationBarLoading(); //在标题栏中显示加载图标
 
    let url = app.globalConfig.pre_api + "/api/user/getUserInfo.php";//根据实际情况定义请求的路径
    let user_id = app.globalData.user_id;                            //请求的参数
    let flag = true;
    let that = this;
    // 验证参数合法性
    flag = app.isParameterdValidate(user_id,'该用户不存在');
    if(flag == false){ return; }
    // 发送请求
    wx.request({
      url: url,data: {
        user_id: user_id,},method: 'POST',
      //请求成功的函数处理
      success: function (res) {
        app.globalData.balance = res.data.data.balance;   //对数据进行更新
        that.setData({
          balance: app.globalData.balance,});
      },fail: function (res) {                             //请求失败的处理
        console.log(res.data.msg);
      },complete: function () {
        wx.hideNavigationBarLoading();                   //完成停止加载
        // 动态设置导航条标题
        wx.setNavigationBarTitle({
          title: '我的'
        });
        wx.stopPullDownRefresh();                       //停止下拉刷新
      }
    })
  },



相关文章

概述 消息能力是小程序能力中的重要组成,我们为开发者提供了...
判断H5页面环境在微信中还是小程序中 用小程序提供的wx.mini...
wx.reLaunch和wx.navigateTo,wx.navigateTo的区别 2019-03-...
微信小程序如何从数组里取值_微信小程序 传值取值的几种方法...
H5项目接入微信授权登录,通过 UA 区分微信还是普通浏览器:...
微信小程序获取data-xx=""属性的值,自定...