feat: optimized

Author: NelsonYong

packages/types/index.d.ts

@@ -1,6 +1,6 @@
 {
   "name": "@vue-hooks-plus/types",
-  "version": "2.0.0",
+  "version": "2.0.1",
   "description": "",
   "files": [
     "index.d.ts",

packages/types/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@vue-hooks-plus/use-request-plugins",
-  "version": "2.0.0",
+  "version": "2.1.0",
   "description": "",
   "files": [
     "dist",
@@ -24,7 +24,7 @@
   "author": "NelsonYong",
   "license": "MIT",
   "devDependencies": {
-    "@vue-hooks-plus/use-request":"^1.3.2"
+    "@vue-hooks-plus/use-request":"*"
   },
   "peerDependencies": {
 		"pinia": "^2.0.30"

packages/use-request-plugins/package.json

@@ -1,6 +1,6 @@
 import { ref } from 'vue';
 import { BroadcastChannel, BroadcastChannelOptions } from 'broadcast-channel'
-import { UseRequestPlugin, UseRequestFetchState } from "@vue-hooks-plus/use-request/dist/types/types";
+import { UseRequestFetchState, UseRequestPlugin } from "@vue-hooks-plus/use-request/dist/types/types";
 import Fetch from '@vue-hooks-plus/use-request/dist/types/Fetch';
 
 

packages/use-request-plugins/src/useBroadcastChannelPlugin/useBroadcastChannel.ts

@@ -1,6 +1,6 @@
 {
   "name": "@vue-hooks-plus/use-request",
-  "version": "2.0.1",
+  "version": "2.0.2",
   "description": "Vue use-request hooks library",
 	"files": [
 		"dist",

packages/use-request/package.json

@@ -1,44 +1,47 @@
-import { unref, ref } from "vue";
-import type { UseRequestPlugin, Timeout } from "../types";
-
-const useLoadingDelayPlugin: UseRequestPlugin<unknown, unknown[]> = (
-  fetchInstance,
-  { loadingDelay }
-) => {
-  const timerRef = ref<Timeout>();
-  if (!unref(loadingDelay)) {
-    return {};
-  }
+import { ref, unref } from 'vue'
+import { Timeout, UseRequestPlugin } from '../types'
 
-  const cancelTimeout = () => {
-    if (timerRef.value) {
-      clearTimeout(timerRef.value);
-    }
-  };
+const useLoadingDelayPlugin: UseRequestPlugin<unknown, unknown[]> = (inst, { loadingDelay }) => {
+  const delayRef = ref<Timeout>()
 
+  const clear = () => {
+    if (delayRef.value) {
+      clearTimeout(unref(delayRef.value))
 
+      delayRef.value = undefined
+    }
+  }
 
   return {
-    name: "loadingDelayPlugin",
-    onBefore: () => {
-      cancelTimeout();
-      timerRef.value = setTimeout(() => {
-        fetchInstance.setState({
+    name: 'loadingDelayPlugin',
+    onFinally: () => {
+      clear()
+
+      const delay = unref(loadingDelay)
+
+      /**
+       *
+       * if loadingDelay is set, the loading state will be delayed,
+       * until the delay time is reached.
+       *
+       * if delay is set to 0, the loading state will not be delayed. because 0 is mean nothing.
+       */
+      if (delay) {
+        inst.setState({
           loading: true,
-        });
-      }, (unref(loadingDelay)) as number);
+        })
 
-      return {
-        loading: false,
-      };
+        delayRef.value = setTimeout(() => {
+          inst.setState({
+            loading: false,
+          })
+        }, delay)
+      }
     },
-    onFinally: () => {
-      cancelTimeout();
+    onError: () => {
+      clear()
     },
-    onCancel: () => {
-      cancelTimeout();
-    },
-  };
-};
+  }
+}
 
-export default useLoadingDelayPlugin;
+export default useLoadingDelayPlugin

packages/use-request/src/plugins/useLoadingDelayPlugin.ts

@@ -56,7 +56,7 @@ export type UseRequestBasicOptions<TData, TParams extends unknown[]> = {
   /**
    * Init data.
    */
-  // initialData?: TData
+  initialData?: TData
 
   /**
    * - The default is `false.` That is, the service is automatically executed during initialization.