小程序怎么实现上拉刷新下拉加载


这篇文章主要介绍“小程序怎么实现上拉刷新下拉加载”,在日常操作中,相信很多人在小程序怎么实现上拉刷新下拉加载问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”小程序怎么实现上拉刷新下拉加载”的疑惑有所帮助!接下来,请跟着小编一起来学习吧!
  
  上拉刷新,下拉加载,分别点击tab都还能够请求服务器。我想的最好的方法是把日期和月份这2个抽离出来做成一个方法,然后上拉刷新,下拉加载,点击tab分别调用日期和月份方法即可。我尝试百度/google,见到最多的链式写法,以获取用户数据举例:
  //这里的操作都是举例说明。
  wxLogin()
  .then(=>res{
  console.log(res.code)
  return wxRequest.getUserOpenId(url, params)//请求获取用户ID
  })
  .then(=>res{
  console.log(res.openId)
  return wxRequest.getUserPhone());//请求获取用户手机
  })
  .catch()
  在index.js页面 ; getUserOpenId()和getUserPhone()都是封装在另外一个js里面的。或者是直接getUserMessage().then(res=>).catch();这样直接获取用户数据了。
  wxRequest.getUserMessage()
  .then(=>res{
  console.log(res.code);
  })
  .catch()
  当然我这样举例还是不能说明存在什么问题,那么如果我要像上面图那样获取日期数据,月份数据怎么办呢?难道按照第一个那样写,上拉加载那里写一堆,下拉刷新那里一堆,切换tab也写一堆重复的代码?还是说我管你是上拉刷新,还是下拉加载好,我直接通过一个接口在一起获取数据?所以我通过百度/google到他们写的还不够完善(不是写的不好哈)
  我的写法:
  //我只是抽取我部分代码来展示
  Page({
  data:{
  },
  onLoad: function () {//生命周期
  this.readUserMesage();
  },
  readUserMesage(): function () {//获取用户信息,免费云主机域名并获取按日期的数据
  this.showLoading();
  let parameters = ‘user?ptId=aaaaaaaaaaaaaa’;
  api.getRequest({
  parameters: parameters,
  }).then(res => {
  return this.readDayData(); //获取日期信息
  }).catch(error => {
  this.hideLoading();
  });
  },
  readMonthData() {//把月份单独抽取出来
  var url = ‘dailypay?xxxxx=aaaa&yyy=bbbbbb’;
  var parameters = { parameters: url }
  return api.getRequest(parameters)//我这里是封装请求服务器的,注意我加了return
  .then(res => {
  //这里就可以获取到返回的res的集合数据
  }).catch(error => {
  console.log(JSON.stringify(error));
  this.hideLoading();
  });
  },
  readDayData() {//把日期单独抽取出来
  var url = ‘dailypay?xxxxx=aaaa&yyy=bbbbbb’;
  var parameters = { parameters: url }
  return api.getRequest(parameters)//我这里是封装请求服务器的,注意我加了return
  .then(res => {
  //这里就可以获取到返回的res的集合数据
  }).catch(error => {
  this.hideLoading();
  });
  },
  onPullDownRefresh() {//下拉刷新
  if (this.data.currentIndex == 0) {//如果当前是在日期
  this.readDayData();
  } else {//如果当前是在月份
  this.readMonthData();
  }
  },
  onReachBottom() {//上拉加载
  if (this.data.currentIndex == 0) {
  this.readDayData();
  } else {
  this.readMonthData();
  }
  },
  )}到此,关于“小程序怎么实现上拉刷新下拉加载”的学习就结束了,希望能够解决大家的疑惑。理论与实践的搭配能更好的帮助大家学习,快去试试吧!若想继续学习更多相关知识,请继续关注百云主机网站,小编会继续努力为大家带来更多实用的文章!

相关推荐: Java如何实现实现IO版学生管理系统

这篇文章将为大家详细讲解有关Java如何实现实现IO版学生管理系统,小编觉得免费云主机域名挺实用的,因此分享给大家做个参考,希望大家阅读完这篇文章后可以有所收获。具体内容如下图解:cade:student.javastudentmangager类关于“Java…

免责声明:本站发布的图片视频文字,以转载和分享为主,文章观点不代表本站立场,本站不承担相关法律责任;如果涉及侵权请联系邮箱:360163164@qq.com举报,并提供相关证据,经查实将立刻删除涉嫌侵权内容。

(0)
打赏 微信扫一扫 微信扫一扫
上一篇 10/21 16:14
下一篇 10/21 16:14

相关推荐