type: use-request Readonly field & notes

Author: NelsonYong

packages/hooks/src/useRequest/docs/basic/demo/demo.vue

@@ -4,15 +4,15 @@
 </template>
 
 <script lang="ts" setup>
-import { useRequest } from 'vue-hooks-plus'
+  import { useRequest } from 'vue-hooks-plus'
 
-function getUsername(params: { desc: string }): Promise<string> {
-  return new Promise(resolve => {
-    setTimeout(() => {
-      resolve(`vue-hooks-plus ${params.desc}`)
-    }, 1000)
-  })
-}
+  function getUsername(params: { desc: string }): Promise<string> {
+    return new Promise(resolve => {
+      setTimeout(() => {
+        resolve(`vue-hooks-plus ${params.desc}`)
+      }, 1000)
+    })
+  }
 
-const { data, loading } = useRequest(() => getUsername({ desc: 'good' }))
+  const { data, loading } = useRequest(() => getUsername({ desc: 'good' }))
 </script>

packages/hooks/src/useRequest/types.ts

@@ -20,9 +20,9 @@ export interface UseRequestPluginReturn<TData, TParams extends unknown[]> {
     params: TParams,
   ) =>
     | ({
-        stopNow?: boolean
-        returnNow?: boolean
-      } & Partial<UseRequestFetchState<TData, TParams>>)
+      stopNow?: boolean
+      returnNow?: boolean
+    } & Partial<UseRequestFetchState<TData, TParams>>)
     | void
 
   onRequest?: (
@@ -246,22 +246,22 @@ export interface useRequestResult<TData, TParams extends unknown[]> {
   /**
    * Is the service being executed.
    */
-  loading: Ref<boolean>
+  loading: Readonly<Ref<boolean>>
 
   /**
    * Data returned by service.
    */
-  data: Ref<TData | undefined>
+  data: Readonly<Ref<TData | undefined>>
 
   /**
    * 	Exception thrown by service.
    */
-  error: Ref<Error | undefined>
+  error: Readonly<Ref<Error | undefined>>
 
   /**
    * params	An array of parameters for the service being executed. For example, you triggered `run(1, 2, 3)`, then params is equal to `[1, 2, 3]`.
    */
-  params: Ref<TParams | []>
+  params: Readonly<Ref<TParams | []>>
 
   /**
    * Ignore the current promise response.

packages/hooks/src/useRequest/useRequestImplement.ts

@@ -17,13 +17,6 @@ function isUseRequestFetchState<TData, TParams extends any[]>(
   return keys.filter(i => ['data', 'loading', 'params', 'error'].includes(i)).length === 4
 }
 
-// function isUseRequestFetchStateKey<TData, TParams extends any[]>(
-//   field: string,
-//   state: unknown,
-// ): state is UseRequestFetchState<TData, TParams>[keyof UseRequestFetchState<TData, TParams>] {
-//   return Boolean(['data', 'loading', 'params', 'error'].find(i => i === field))
-// }
-
 function useRequestImplement<TData, TParams extends any[]>(
   service: UseRequestService<TData, TParams>,
   options: UseRequestOptions<TData, TParams, any> = {},
@@ -59,9 +52,6 @@ function useRequestImplement<TData, TParams extends any[]>(
 
   const setState = (currentState: unknown, field?: keyof typeof state) => {
     if (field) {
-      // if (isUseRequestFetchStateKey<UnwrapRef<TData>, UnwrapRef<TParams>>(field, currentState)) {
-      //   state[field] = currentState as any
-      // }
       state[field] = currentState as any
     } else {
       if (isUseRequestFetchState<UnwrapRef<TData>, UnwrapRef<TParams>>(currentState)) {
@@ -91,18 +81,10 @@ function useRequestImplement<TData, TParams extends any[]>(
 
   const readyComputed = computed(() => isRef(ready) ? ready.value : ready)
 
-  // const isMount = ref(false)
-
   watchEffect(() => {
     if (!manual) {
       const params = fetchInstance.state.params || options.defaultParams || []
-      // if (readyComputed.value && !isMount.value) {
-      //   fetchInstance.run(...(params as TParams))
-      //   // 模拟首次mount
-      //   isMount.value = true
-
-      // }
-      // 自动收集依赖
+      // auto collect
       if (readyComputed.value && fetchInstance.options.refreshDeps === true && !!serviceRef.value) {
         fetchInstance.run(...(params as TParams))
       }

packages/use-request-plugins/src/useFetchingPlugin/useFetching.ts

@@ -2,8 +2,29 @@ import { UseRequestPlugin } from '@vue-hooks-plus/use-request/dist/types/types'
 import { useFetchingGlobalStore } from './store'
 
 export interface FetchingPluginType {
+  /**
+   * useRequest params
+   * @param params request params
+   * @type (params: any[]) => string
+   * @returns string
+   */
   fetchingKey?: (params: any[]) => string
+
+  /**
+   * 
+   * @param current current fetch data
+   * @param record all fetch data
+   * @type (current: any, record: any) => void
+   * @returns void
+   */
   onFetching?: (current: any, record: any) => void
+
+  /**
+   * 
+   * @param _isFetching all fetching loading status
+   * @type (_isFetching: boolean) => void
+   * @returns void
+   */
   isFetching?: (_isFetching: boolean) => void
 }