mescroll 上拉加载,下拉刷新,分页数据,无内容显示图片

<mescroll-body ref="mescrollRef" @init="mescrollInit" :up="upOption" :down="downOption" @down="downCallback"
			@up="upCallback" :safearea="true" style="background-color:#f2f1f6;">
			
            <view>代码块</view>
		</mescroll-body>

上面是html

data

data() {
			return {
				keywords:'',
				data_list:[],
				mescroll: null, // mescroll实例对象 (此行可删,mixins已默认)
				// 下拉刷新的配置(可选, 绝大部分情况无需配置)
				downOption: {
					auto: false
				},
				// 上拉加载的配置(可选, 绝大部分情况无需配置)
				upOption: {
					use: true, //是否启用上拉加载
					auto: false, //是否在初始化完毕之后自动执行一次上拉加载的回调
					page: {
						num:0,
						size: 10 // 每页数据的数量,默认10
					},
					noMoreSize: 5, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示
					textNoMore: '', //底部无数据的提示，默认是 -- END --'
					toTop: { //会到顶部的按钮设置
						src: '', //图片路径，配置为空，为隐藏
						width: 72, //回到顶部图标的宽度 (支持"20rpx", "20px", "20%"格式的值, 纯数字则默认单位rpx. 1.2.0新增)
						radius: "50%" //radius: 圆角 (支持"20rpx", "20px", "20%"格式的值, 纯数字则默认单位rpx. 1.2.0新增)
					},
					empty: { //无数据的占位图
						use: true,
						icon: '/static/nodata.png',
						tip: '暂无数据',
						btnText: '',
						fixed: true,
						top: "190rpx",
						zIndex: 99,
					}
				},
				
			}
		},

methods部分:

            searchClick(){
				this.downCallback()
			},
			/*mescroll组件初始化的回调,可获取到mescroll对象*/
			mescrollInit(mescroll) {
				var that = this;
				that.mescroll = mescroll;
			},
			/*下拉刷新的回调*/
			downCallback() {
				var that = this;
				console.log('下拉刷新');
				console.log(that.mescroll);
				that.mescroll.resetUpScroll();
			},
			
			/*上拉加载的回调*/
			upCallback(page) {
				var that = this;
				console.log('上拉加载');
				let params,url
				params = {
					page: that.mescroll.num,
					contract_status:that.status,
				}
				
				url='/base/api.member_order/contract_list'
				uni.$http.post(url, params).then((r) => {
					console.log('r-list',r);
					let data = r.data;
					console.log(data);
					if (data.code != 1) {
						that.mescroll.endErr();
						uni.showToast({
							title: data.info,
							icon: 'none'
						})
						return
					}
					//mescroll.endSuccess(dataSize, hasNext, systime) 隐藏下拉刷新和上拉加载的状态, 在联网获取数据成功后调用
					// dataSize : 当前页获取的数据量(注意是当前页)
					// hasNext : 是否有下一页数据true/false
					// systime : 加载第一页数据的服务器时间 (可空);
					// that.mescroll.endSuccess(data.data.length);
					//方法一(推荐): 后台接口有返回列表的总页数 totalPage
					that.mescroll.endByPage(data.data.length, data.total);
					if (that.mescroll.num == 1) {
						that.data_list = [];
					}
					//a.concat(b) 数组a中追加数组b的元素
					that.data_list = that.data_list.concat(data.data);
					if (that.mescroll.num == 1) {
						//(y,t) y=0,则回到列表顶部; 如需滚动到列表底部,可设置y很大的值,比如y=99999,t时长，默认300ms，为0时不需要动画
						that.mescroll.scrollTo(0, 0);
					}
				}).catch((err) => {
					// uni.hideLoading();
					that.mescroll.endErr();
				});
			},