diff --git a/src/api/foo.ts b/src/api/foo.ts index cfa39a5..a500002 100644 --- a/src/api/foo.ts +++ b/src/api/foo.ts @@ -21,8 +21,8 @@ export interface IFooItem { } /** GET 请求 */ -export function getFooAPI(name: string) { - return http.get('/foo', { name }) +export async function getFooAPI(name: string) { + return await http.get('/foo', { name }) } /** GET 请求;支持 传递 header 的范例 */ export function getFooAPI2(name: string) { diff --git a/src/hooks/useRequest.ts b/src/hooks/useRequest.ts index 7aa7bc6..1290dbd 100644 --- a/src/hooks/useRequest.ts +++ b/src/hooks/useRequest.ts @@ -26,27 +26,62 @@ interface IUseRequestReturn { * @returns 返回一个对象{loading, error, data, run},包含请求的加载状态、错误信息、响应数据和手动触发请求的函数。 */ export default function useRequest( - func: (args?: P) => HttpRequestResult, + func: (args?: P) => Promise | Promise> | HttpRequestResult | T, options: IUseRequestOptions = { immediate: false }, ): IUseRequestReturn { const loading = ref(false) const error = ref(false) const data = ref(options.initialData) as Ref let requestTask: UniApp.RequestTask | undefined + const isCancelled = ref(false) - const run = async (args?: P) => { + const run = async (args?: P): Promise => { loading.value = true - const { promise, requestTask: task } = func(args) - requestTask = task // Store the requestTask + error.value = false + isCancelled.value = false + let promise: Promise + const result = func(args) + + if (result instanceof Promise) { + promise = result.then((res) => { + if (res && typeof (res as HttpRequestResult).promise === 'object' && typeof (res as HttpRequestResult).requestTask === 'object') { + const { promise: p, requestTask: task } = res as HttpRequestResult + requestTask = task + if (isCancelled.value) { + task.abort() + throw new Error('Request cancelled') + } + return p + } + if (isCancelled.value) { + throw new Error('Request cancelled') + } + return res as T | undefined + }) as Promise + } + else if (result && typeof (result as HttpRequestResult).promise === 'object' && typeof (result as HttpRequestResult).requestTask === 'object') { + const { promise: p, requestTask: task } = result as HttpRequestResult + requestTask = task + promise = p + } + else { + promise = Promise.resolve(result as T | undefined) + } + return promise .then((res) => { + if (isCancelled.value) { + return + } data.value = res - error.value = false return data.value }) .catch((err) => { - error.value = err - throw err + if (!isCancelled.value) { + error.value = err + throw err + } + return Promise.resolve(undefined) }) .finally(() => { loading.value = false @@ -54,11 +89,12 @@ export default function useRequest( } const cancel = () => { + isCancelled.value = true if (requestTask) { requestTask.abort() - loading.value = false // Reset loading state on cancel - error.value = new Error('Request cancelled') // Set a specific error for cancellation } + loading.value = false + error.value = new Error('Request cancelled') } if (options.immediate) { diff --git a/src/http/http.ts b/src/http/http.ts index 2e1dd4a..6309526 100644 --- a/src/http/http.ts +++ b/src/http/http.ts @@ -24,7 +24,7 @@ export function http(options: CustomRequestOptions) { // 状态码 2xx,参考 axios 的设计 if (res.statusCode >= 200 && res.statusCode < 300) { // 2.1 处理业务逻辑错误 - const { code, message, msg, data } = res.data as IResponse + const { code = 0, message = '', data = null } = res.data as IResponse // 0和200当做成功都很普遍,这里直接兼容两者,见 ResultEnum if (code !== ResultEnum.Success0 && code !== ResultEnum.Success200) { throw new Error(`请求错误[${code}]:${message || msg}`)