import { ref, reactive, toRefs, onMounted, watch } from "vue" import { onPullDownRefresh, onShow, onReachBottom, onLoad } from "@dcloudio/uni-app" // requestFun: 请求函数 dataHandle: 数据处理函数 params 额外的固定的请求数据 export default function (config) { const { requestFun, dataHandle = (data) => data, params = {}, flag = true, onshow = true, pageSize = 10 } = config // 该对象会返回给每个页面,用于取值 const useDataResult = reactive({ dataList: [], // 数据列表 listTipText: "加载更多", // 列表底部提示文字 1.加载更多 2.加载中 3.暂无更多 }) const listParams = {} // 页面传参对象 getList方法中传的参数 const queryObj = reactive({ pageNumber: 1, // 默认是1 pageSize: pageSize, // 默认10条,可传参修改 isLoad: false, // 是否为上拉加载 titlePage: "", // 总页数 }) const getList = (listParamObj) => { // 非下拉刷新才显示加载提示 if (queryObj.isLoad) { uni.showLoading({ title: "加载中" }) } useDataResult.listTipText = "加载中" // 列表底部提示文字 1.加载更多 2.加载中 3.暂无更多 // listParamObj 父组件在函数中携带的请求参数,与页码页数,固定参数,合并到一起,并且当该参数对象在调用时有具体值,会将页码重置为1 let paramObj // 参数合并 if (listParamObj) { queryObj.pageNumber = 1 Object.keys(listParamObj).forEach((item) => { listParams[item] = listParamObj[item] }) useDataResult.dataList = [] } paramObj = Object.assign( { pageNumber: queryObj.pageNumber, pageSize: queryObj.pageSize, }, params, listParams ) paramObj.pageNumber = queryObj.pageNumber paramObj.pageSize = queryObj.pageSize requestFun(paramObj) .then(({ bizData }) => { uni.hideLoading() queryObj.titlePage = Math.ceil(bizData.total / queryObj.pageSize) // 页码总数 if (queryObj.titlePage == queryObj.pageNumber || bizData.records.length == 0) { useDataResult.listTipText = "暂无更多" } uni.stopPullDownRefresh() // 请求成功停止下拉刷新 // dataHandle 函数用于对数据的集中处理,在每个页面可自定义 let data = dataHandle(bizData.records ? bizData.records : bizData) // 下拉刷新重置数据, 上拉加载新增数据 if (queryObj.isLoad) { useDataResult.dataList.push(...data) } else { useDataResult.dataList = data } }) .catch((err) => uni.hideLoading()) } // 只在onshow时调用一次, 请求方法 const onShowGetList = () => { if (!flag) return false uni.showLoading({ title: "加载中" }) queryObj.pageNumber = 1 // 页码固定为1 let paramObj = Object.assign( { // 合并请求参数 pageNumber: 1, pageSize: queryObj.pageSize, }, params ) Object.assign(paramObj, listParams) requestFun(paramObj).then(({ bizData }) => { uni.hideLoading() queryObj.titlePage = Math.ceil(bizData.total / queryObj.pageSize) if (queryObj.titlePage == queryObj.pageNumber || bizData.records.length == 0) { useDataResult.listTipText = "暂无更多" } // dataHandle 函数用于对数据的集中处理,在每个页面可自定义 let data = dataHandle(bizData.records ? bizData.records : bizData) useDataResult.dataList = data // 由于只在onShow 中调用一次,所以数据重新赋值 }) } onShow(() => { if (onshow) { onShowGetList() } }) onLoad(() => { if (!onshow) { onShowGetList() } }) // 下拉刷新 onPullDownRefresh(() => { queryObj.pageNumber = 1 queryObj.isLoad = false getList() }) // 上拉加载 onReachBottom(() => { queryObj.pageNumber++ if (queryObj.pageNumber > queryObj.titlePage) { queryObj.pageNumber = queryObj.pageNumber return (queryObj.isLoad = false) } queryObj.isLoad = true getList() }) return { useDataResult, // 返回结果对象 getList, // 请求函数,每个页面自定义请求参数 } }