uni-app下拉刷新，上拉加载数据

<template>
	<view class="base-box">
		<scroll-view scroll-y style="height: 100%;width: 100%;" :refresher-triggered="triggered" :refresher-enabled="true" @refresherrefresh="refreshPage"
		 refresher-background="transparent" @scrolltolower="reachBottom"  @refresherrestore="onRestore">
			<view v-if="msgList.length > 0" class="page-box">
				<uni-list class="uni-list_detail" v-for="(item, i) in msgList" :key="i">
					<uni-list-item-custom :showArrow="false" :title="item.title" :show-extra-icon="false" :showBadge="item.isRead == 0"
					 badgeText="1" badgeType="error" :notes="item.message" :rightText="item.time"
					 @click="goChatMain(item.id, item.text)"></uni-list-item-custom>
				</uni-list>
				<u-loadmore :status="loadStatus"></u-loadmore>
			</view>
			<view v-if="msgList.length == 0" class="page-box-none">
				<view class="data-none">
					<image src="/static/images/none.jpg" mode="aspectFill"></image>
				</view>
			</view>
		</scroll-view>
	</view>
</template>

<script>
	import { isJSON } from '../../common/util.js'
	export default {
		data() {
			return {
				userInfo: getApp().globalData.userInfo,
				// 当前登录者所有资产
				appIdentitys: getApp().globalData.appIdentitys,
				// 当前登录者当前选中的小区
				currentEstates: getApp().globalData.currentEstates,
				msgList:[],
				pageInfo: {
					totalCount: 0,
					totalPage: 1,
					currpage: 0
				},
				triggered: false,
				loadStatus: 'loadmore',
			};
		},
		onLoad(option) {
			setTimeout(()=>{
				this.triggered = true;	
			},200)
		},
		onShow() {
		},
		computed: {
		},
		methods: {
			
			onRestore() {
				this.triggered = 'restore'; // 需要重置
			},
			refreshPage() {
				if (this._freshing) return;
				this._freshing = true;
				this.pageInfo = {
					totalCount: 0,
					pageSize: 12,
					totalPage: 1,
					currpage: 0
				};
				this.getOrderList(()=>{
					setTimeout(()=>{
						this.triggered = false;
						this._freshing = false;
					},2000)
				});
			},
			reachBottom() {
				this.getOrderList();
			},
			// 页面数据
			async getOrderList(callback) {
				try{
					if(typeof callback == 'function'){
						callback();
					}
					let currpage = this.pageInfo.currpage;
					let totalPage = this.pageInfo.totalPage;
					if (currpage == totalPage) {
						this.loadStatus= "nomore";
						return;
					}
					this.loadStatus= "loading";
					let resData = await this.$u.api.msgList({
						pageSize: this.pageInfo.pageSize,
						pageNum: ++currpage
					});
					if (resData.data.code == '0000000' && resData.data.data.code == 0) {
						let resTotalCount = resData.data.data.page.totalCount,
							resTotalPage = resData.data.data.page.totalPage,
							resCurrPage = resData.data.data.page.currPage;
						this.pageInfo = {
							totalCount: resTotalCount,
							totalPage: resTotalPage,
							currpage: resCurrPage,
							pageSize: this.pageInfo.pageSize
						};
						if(resCurrPage <= 1){
							this.msgList = [];
						}
						this.msgList = this.msgList.concat(resData.data.data.page.list);	
						if (resData.data.data.page.currPage < resData.data.data.page.totalPage) {
							this.loadStatus = "loadmore";
						} else {
							this.loadStatus = "nomore";
						}
					}
				}catch(e){
					this.loadStatus= "nomore";
				}
			},
		}
	};
</script>

<style>
	/* #ifndef H5 */
	page {
		height: 100%;
		background-color: #f2f2f2;
	}

	/* #endif */
</style>

<style lang="scss" scoped>
	.msg-main {
		width: 100%;
		.uni-list_detail {
			margin: 5upx 0;
			height: auto;
		}
		.data-none{
			width: 330rpx;
			height: 330rpx;
			overflow: hidden;
			border-radius: 50%;
			margin: auto;
			margin-top: 150rpx;
			image {
				width: 350rpx;
				height: 350rpx;
				margin-top: -26rpx;
				margin-left: -10rpx;
			}
		}
	}
	
</style>