mescroll-uni组件上拉底部一直显示加载中..(mescroll-uni的使用)

官网mescroll-uni

原因是upCallback函数里面使用了this.mescroll.xxx(xx, xx)在请求成功后,隐藏加载状态。应该使用upCallback(mescroll) {}函数参数里的mescroll.xxx(xx, xx)在请求成功后,隐藏加载状态。

async upCallback(mescroll) {
	...
		const data = res.data.records;
		const total = res.data.total;
		if (mescroll.num === 1) this.dataList = [];
		this.dataList = this.dataList.concat(data);
		mescroll.endBySize(data.length, total); // !!!
	} catch (e) {
		mescroll.endErr(); // !!!
	}
},

模版

async upCallback(mescroll) {
	try {
		let params = {
			
		}
		const data = (await xxx(params)).data
		const records = data.records
		const total = data.total
		mescroll.endBySize(records.length, total);

		//方法一(推荐): 后台接口有返回列表的总页数 totalPage
		//必传参数(当前页的数据个数, 总页数)
		//mescroll.endByPage(curPageData.length, totalPage);
				
		//方法二(推荐): 后台接口有返回列表的总数据量 totalSize
		//必传参数(当前页的数据个数, 总数据量)
		//mescroll.endBySize(curPageData.length, totalSize);
				
		//方法三(推荐): 您有其他方式知道是否有下一页 hasNext
		//必传参数(当前页的数据个数, 是否有下一页true/false)
		//mescroll.endSuccess(curPageData.length, hasNext);

		if (mescroll.num === 1) this.list = [];
		this.list = this.list.concat(records);
	} catch (e) {
		mescroll.endErr();
	}
},
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 2
    评论
mescroll-uni是一个基于uni-app框架的下拉刷新和上拉加载的插件。它提供了一种简单、灵活的方式来实现页面的滚动加载效果。 使用mescroll-uni,你需要按照以下步骤进行操作: 1. 首先,你需要在你的uni-app项目安装mescroll-uni插件。你可以使用npm命令来安装,执行以下命令: ``` npm install mescroll-uni ``` 2. 在你的页面引入mescroll-uni插件。可以在需要使用滚动加载的页面的`<template>`引入mescroll-uni组件,例如: ``` <template> <view> <mescroll-uni></mescroll-uni> </view> </template> ``` 3. 在你的页面的`<script>`引入mescroll-uni组件,并配置相应的参数。例如: ``` <script> import MescrollUni from 'mescroll-uni' export default { components: { MescrollUni }, data() { return { mescrollOptions: { down: { use: true, callback: this.downCallback }, up: { use: true, callback: this.upCallback } } } }, methods: { downCallback() { // 下拉刷新的回调函数 // 执行刷新逻辑 }, upCallback() { // 上拉加载的回调函数 // 执行加载更多逻辑 } } } </script> ``` 4. 根据你的需求,实现对应的下拉刷新和上拉加载的逻辑处理。在`data`配置`mescrollOptions`对象,通过`down`和`up`属性来配置下拉刷新和上拉加载的回调函数。 这样,你就可以使用mescroll-uni插件实现下拉刷新和上拉加载的效果了。具体的配置和使用方法可以参考mescroll-uni的官方文档。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

Amodoro

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值