封装请求hook
This commit is contained in:
+97
-81
@@ -1,54 +1,75 @@
|
||||
|
||||
|
||||
import Taro from '@tarojs/taro'
|
||||
import { useState } from 'react'
|
||||
import { useRef, useState } from 'react'
|
||||
import qs from 'qs';
|
||||
/**
|
||||
* 返回状态信息,根据 http 状态错
|
||||
* @param {Number} status
|
||||
* @returns
|
||||
*/
|
||||
const showStatus = (status) => {
|
||||
let message = ''
|
||||
switch (status) {
|
||||
case 400:
|
||||
message = '请求错误(400)'
|
||||
break
|
||||
case 401:
|
||||
message = '未授权,请重新登录(401)'
|
||||
break
|
||||
case 403:
|
||||
message = '拒绝访问(403)'
|
||||
break
|
||||
case 404:
|
||||
message = '请求出错(404)'
|
||||
break
|
||||
case 408:
|
||||
message = '请求超时(408)'
|
||||
break
|
||||
case 500:
|
||||
message = '服务器错误(500)'
|
||||
break
|
||||
case 501:
|
||||
message = '服务未实现(501)'
|
||||
break
|
||||
case 502:
|
||||
message = '网络错误(502)'
|
||||
break
|
||||
case 503:
|
||||
message = '服务不可用(503)'
|
||||
break
|
||||
case 504:
|
||||
message = '网络超时(504)'
|
||||
break
|
||||
case 505:
|
||||
message = 'HTTP版本不受支持(505)'
|
||||
break
|
||||
default:
|
||||
message = `连接出错(${status})!`
|
||||
}
|
||||
return `${message},请检查网络或联系管理员!`
|
||||
|
||||
|
||||
|
||||
type Params = {
|
||||
code: string|null
|
||||
success: true|false
|
||||
data: any,
|
||||
msg: string,
|
||||
loading: true|false,
|
||||
error: any,
|
||||
query: any,
|
||||
filter: any,
|
||||
sort: any,
|
||||
total: number,
|
||||
multiple: true|false, // 请求多次
|
||||
count: number, // 第几次请求
|
||||
token: string, // token
|
||||
page?: number,
|
||||
pageSize?: number
|
||||
}
|
||||
|
||||
/**
|
||||
* 返回状态信息,根据 http 状态错
|
||||
* @param {Number} status
|
||||
* @returns
|
||||
*/
|
||||
const showStatus = (status) => {
|
||||
let message = ''
|
||||
switch (status) {
|
||||
case 400:
|
||||
message = '请求错误(400)'
|
||||
break
|
||||
case 401:
|
||||
message = '未授权,请重新登录(401)'
|
||||
break
|
||||
case 403:
|
||||
message = '拒绝访问(403)'
|
||||
break
|
||||
case 404:
|
||||
message = '请求出错(404)'
|
||||
break
|
||||
case 408:
|
||||
message = '请求超时(408)'
|
||||
break
|
||||
case 500:
|
||||
message = '服务器错误(500)'
|
||||
break
|
||||
case 501:
|
||||
message = '服务未实现(501)'
|
||||
break
|
||||
case 502:
|
||||
message = '网络错误(502)'
|
||||
break
|
||||
case 503:
|
||||
message = '服务不可用(503)'
|
||||
break
|
||||
case 504:
|
||||
message = '网络超时(504)'
|
||||
break
|
||||
case 505:
|
||||
message = 'HTTP版本不受支持(505)'
|
||||
break
|
||||
default:
|
||||
message = `连接出错(${status})!`
|
||||
}
|
||||
return `${message},请检查网络或联系管理员!`
|
||||
}
|
||||
|
||||
|
||||
/**
|
||||
@@ -69,28 +90,25 @@ export const useRequest = (options = {
|
||||
pagination: false, // 是否分页
|
||||
}) => {
|
||||
|
||||
let params:any = {
|
||||
|
||||
let params:Params = {
|
||||
code: null, // 业务码
|
||||
success: null, // 请求是否成功
|
||||
success: false, // 请求是否成功
|
||||
data: {},
|
||||
msg: '',
|
||||
loading: null,
|
||||
loading: false,
|
||||
error: null,
|
||||
query: {},
|
||||
filter: null,
|
||||
sort: null,
|
||||
sort: '',
|
||||
total: 0,
|
||||
multiple: true, // 请求多次
|
||||
count: 0, // 第几次请求
|
||||
token: '', // token
|
||||
}
|
||||
|
||||
if(options.pagination) {
|
||||
params.page = options.page
|
||||
params.pageSize = options.pageSize
|
||||
}
|
||||
|
||||
const [state, setState] = useState({...params})
|
||||
const stateRef = useRef({...params})
|
||||
const [state, setState] = useState({...stateRef.current})
|
||||
|
||||
// // 每页多少条记录
|
||||
// const handleSizeChange = (val) => {
|
||||
@@ -120,7 +138,7 @@ export const useRequest = (options = {
|
||||
// eslint-disable-next-line
|
||||
const handleSort = (val, orderby = "desc") => {
|
||||
if (val != null) {
|
||||
state.sort = orderby ? {
|
||||
stateRef.current.sort = orderby ? {
|
||||
sort_key: `${orderby == 'desc' ? '-' + val : val}`
|
||||
} : null
|
||||
}
|
||||
@@ -129,16 +147,16 @@ export const useRequest = (options = {
|
||||
|
||||
// 请求函数
|
||||
const fetchData = async (sub_options) => {
|
||||
state.loading = true
|
||||
|
||||
state.query = {
|
||||
stateRef.current.loading = true
|
||||
setState((e) => ({...e, loading:true}))
|
||||
stateRef.current.query = {
|
||||
...sub_options,
|
||||
...options.pagination && {
|
||||
page: state.page,
|
||||
size: state.size,
|
||||
page: stateRef.current.page,
|
||||
size: stateRef.current.pageSize,
|
||||
},
|
||||
...state.filter,
|
||||
...state.sort
|
||||
...stateRef.current.filter,
|
||||
...stateRef.current.sort
|
||||
}
|
||||
try {
|
||||
let token = Taro.getStorageSync('token')
|
||||
@@ -147,13 +165,13 @@ export const useRequest = (options = {
|
||||
...{
|
||||
header: {
|
||||
"Platform": 3,
|
||||
"Authorization": token || state.token,
|
||||
"Authorization": token || stateRef.current.token,
|
||||
}
|
||||
},
|
||||
...options.method?.toUpperCase() == 'GET' ? {
|
||||
data: state.query
|
||||
data: stateRef.current.query
|
||||
} : {
|
||||
data: options.type?.toUpperCase() == 'FORMDATA' ? qs.stringify(state.query) : state.query
|
||||
data: options.type?.toUpperCase() == 'FORMDATA' ? qs.stringify(stateRef.current.query) : stateRef.current.query
|
||||
}
|
||||
}
|
||||
const result = await Taro.request(q as any)
|
||||
@@ -165,11 +183,11 @@ export const useRequest = (options = {
|
||||
} = result.data
|
||||
console.log(code, msg, data, statusCode);
|
||||
if (statusCode === 200) {
|
||||
state.success = (code === 0 ? true : false)
|
||||
state.code = code
|
||||
state.msg = msg
|
||||
state.data = data
|
||||
state.total = data?.list ? data?.total : 0
|
||||
stateRef.current.success = (code === 0 ? true : false)
|
||||
stateRef.current.code = code
|
||||
stateRef.current.msg = msg
|
||||
stateRef.current.data = data
|
||||
stateRef.current.total = data?.list ? data?.total : 0
|
||||
}else{
|
||||
Taro.showToast({
|
||||
title: `错误:${showStatus(statusCode)}`
|
||||
@@ -183,22 +201,20 @@ export const useRequest = (options = {
|
||||
}
|
||||
|
||||
} catch (e) {
|
||||
console.log('出错', e);
|
||||
state.success = false
|
||||
state.error = true
|
||||
state.msg = e.errMsg
|
||||
stateRef.current.success = false
|
||||
stateRef.current.error = true
|
||||
stateRef.current.msg = e.errMsg
|
||||
|
||||
}
|
||||
state.error = false
|
||||
state.loading = false
|
||||
stateRef.current.error = false
|
||||
stateRef.current.loading = false
|
||||
setState(() => stateRef.current)
|
||||
}
|
||||
|
||||
return {
|
||||
// handleSizeChange,
|
||||
// handleCurrentChange,
|
||||
// handleFilterChange,
|
||||
handleSort,
|
||||
fetchData,
|
||||
state,
|
||||
}
|
||||
|
||||
}
|
||||
Reference in New Issue
Block a user