feat(useFetch): support for custom abort reason (#4820)

doyuli · web-flow · commit 44c0ba8279b7 · 2025-06-19T08:05:58.000Z
diff --git a/packages/core/useFetch/index.test.ts b/packages/core/useFetch/index.test.ts
@@ -835,4 +835,19 @@ describe.skipIf(isBelowNode18)('useFetch', () => {
       expect(data.value).toEqual(expect.objectContaining({ after: 'Global' }))
     })
   })
+
+  it('should abort with given reason', async () => {
+    const { aborted, abort, execute, onFetchError } = useFetch('https://example.com', { immediate: false })
+    const reason = 'custom abort reason'
+    let error: unknown
+    onFetchError((err) => {
+      error = err
+    })
+    execute()
+    abort(reason)
+    await vi.waitFor(() => {
+      expect(aborted.value).toBe(true)
+      expect(error).toBe(reason)
+    })
+  })
 })
diff --git a/packages/core/useFetch/index.ts b/packages/core/useFetch/index.ts
@@ -48,7 +48,7 @@ export interface UseFetchReturn<T> {
   /**
    * Abort the fetch request
    */
-  abort: Fn
+  abort: (reason?: any) => void
 
   /**
    * Manually call the fetch
@@ -394,9 +394,9 @@ export function useFetch<T>(url: MaybeRefOrGetter<string>, ...args: any[]): UseF
   let controller: AbortController | undefined
   let timer: Stoppable | undefined
 
-  const abort = () => {
+  const abort = (reason?: any) => {
     if (supportsAbort) {
-      controller?.abort()
+      controller?.abort(reason)
       controller = new AbortController()
       controller.signal.onabort = () => aborted.value = true
       fetchOptions = {
