1、首先将到uni-app插件市场下载mescroll-/plugin?id=343
或者去mescroll官网下载/load.html?v=190725/
2、将下载到（mescroll-uni目录）的.vue文件复制到自己的项目中components目录下
3、在全局 / 页面中引入插件
全局引入：main.js文件import MescrollUni from '@/components/mescroll-uni/mescroll-uni.vue';ponent('mescroll-uni', MescrollUni)页面引入：import MescrollUni from "@/components/mescroll-uni/mescroll-uni.vue";components: {MescrollUni},
4、在具体页面中的简单示例 :
<template><view class="container"><mescroll-uni mescroll-bodyref="mescrollRef"@init="mescrollInit"@down="downCallback"@up="upCallback":down="downOption":up="upOption":top='40'><!-- 页面显示的内容 --><yongsuoItem /></mescroll-uni></view></template><script>import { wllib } from '@/utils/index.js'import yongsuoItem from '@/components/yewu/yongsuoItem'export default {components: {yongsuoItem,},data() {return {upOption: {page: {num: 0,size: 10, // 每页数据的数量,默认10},noMoreSize: 5, // 配置列表的总数量要大于等于5条才显示'-- END --'的提示textNoMore: '没有更多了',empty: {tip: '暂无相关数据',},},// 列表数据dataList: [],}},methods: {mescrollInit(mescroll) {this.mescroll = mescroll},//下拉刷新时触发downCallback() {// 重置列表为第一页 (自动执行 page.num=1, 再触发upCallback方法 )this.mescroll.resetUpScroll()},//上拉加载时触发upCallback(page) {this.getList(page.num, page.size)},getList(num, size) {if (num == 1) {this.dataList = []}let memberId = uni.getStorageSync('loginInfo')..wlPost('/LockRecord/GetPageLockRecord.do', {memberId,curr_page: num,page_size: size,}).then((dataList) => {console.log(dataList)this.mescroll.endSuccess(dataList.data_list.length,dataList.total_page)//追加新数据this.dataList = [...this.dataList, ...dataList.data_list]}).catch(() => {//联网失败, 结束加载this.mescroll.endErr()})},},}</script><style lang="scss" scoped>.container {padding-top: 40upx;}</style>
5、注意点
（1）该组件全部数据加载完毕后下拉刷新，若单页请求显示的数据没有铺满整页，则无法触发上拉加载的操作
解决办法：
1、设置单次请求的数据量能够铺满整页（size：10 //每页返回10条数据）
2、在upOption上拉配置对象中添加属性 offset：750（属性值可以设置大点，单位默认是rpx）
offset：距底部多远时,触发upCallback
( 2 ) this.mescroll.endUpScroll(true) 直接结束触发上拉加载
