微信小程序各种下拉刷新、下拉加载、页面后退刷新

最新推荐文章于 2024-08-12 11:07:58 发布

林中明月间。

最新推荐文章于 2024-08-12 11:07:58 发布

阅读量858

点赞数

分类专栏：微信小程序

原文链接：https://m.jb51.net/article/124822.htm

版权

微信小程序专栏收录该内容

67 篇文章 4 订阅

订阅专栏

https://m.jb51.net/article/124822.htm

https://www.jianshu.com/p/4be8d10d2724

假设从页面A后退到页面B时B需要刷新，那么可以在B里面写：

onshow:function(){
    this.onLoad();
},

一、在app.json中，将window选项中的enablePullDownRefresh设为true （单页面不需要window）

"window":{ 
   "enablePullDownRefresh":true,
  "backgroundTextStyle": "dark"
}

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

  "enablePullDownRefresh":true,
  "backgroundTextStyle": "dark",



// 下拉刷新
  onPullDownRefresh: function () {
    wx.setNavigationBarTitle({
      title: '拼命加载中...'
    }); 
    wx.showNavigationBarLoading() //在标题栏中显示加载
    this.onLoad() // 页面重新加载
    this.mydatas();// 或者请求数据
    setTimeout(function () {
      wx.setNavigationBarTitle({
        title: '我的'
      }); 
      wx.hideNavigationBarLoading() //完成停止加载
      wx.stopPullDownRefresh() //停止下拉刷新
    }, 1000);
  },


//请求函数
mydatas(){
    let token = wx.getStorageSync('token')
    BaseApi.fenxiao({ //分销和my接口一起
      token: token
    }).then((res) => {
      console.log(res);
      if (res.data.code == 200) {
        let datas = res.data.data;
        this.setData({
          vip_name: datas.vip_name,
        })
      }
    }, (err) => {

    });
  },

上拉刷新：

data() {
			return {
				pindex: 1,
				psize: 15,
				newsList: [],
				totlePage: 0,
				onoff:false,
				newsLength: -1
			}
		},

上拉:
onPullDownRefresh: function() {
			this.pindex = 1
			this.newsList = []
			this.newsLength = -1
			this.getNews() //重新赋值，重新请求数据
		},

下拉加载：
onReachBottom: function() {
			if(this.pindex > this.totalPage){
				this.onoff = true //到底
			}else{
				self.getNews()
			}
		},

getNews: function() {
				uni.showLoading({
					title:'加载中...'
				}),
				n.post("gls/getArticleList", {
					pindex: this.pindex,
					psize: this.psize,
				}, function(res) {
					
					if(res.request.errno == 0){
						if(!res.request.data.length){
							self.newsLength = 0
							uni.hideLoading()
							uni.stopPullDownRefresh()
							return
						}
						var Arr = self.newsList
						var newArr = Arr.concat(res.request.data)
						self.newsList = newArr
						self.totalPage = res.request.total_page
						self.newsLength = self.newsList.length
						self.pindex++
					}else{
						wx.showToast({
							title: res.request.message,
							icon: 'none',
							duration: 2000
						})
					}
					uni.hideLoading()
					uni.stopPullDownRefresh()
				},function(res){
					uni.hideLoading()
					uni.stopPullDownRefresh()
				})
			},