133 lines
3.8 KiB
JavaScript
133 lines
3.8 KiB
JavaScript
import {ref, reactive , toRefs, onMounted, watch} from 'vue'
|
||
import { onPullDownRefresh, onShow, onReachBottom,onLoad } from '@dcloudio/uni-app'
|
||
|
||
// requestFun: 请求函数 dataHandle: 数据处理函数 params 额外的固定的请求数据
|
||
export default function (requestFun, dataHandle = data => data, params = {} ,flag=true,onshow=true,pageSize = 10) {
|
||
|
||
// 该对象会返回给每个页面，用于取值
|
||
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)
|
||
|
||
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)
|
||
|
||
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 中调用一次，所以数据重新赋值
|
||
|
||
}).catch(err => {uni.hideLoading()})
|
||
}
|
||
|
||
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 // 请求函数，每个页面自定义请求参数
|
||
}
|
||
|
||
} |