diff --git a/src/index.ts b/src/index.ts index c226bf4..899ab56 100644 --- a/src/index.ts +++ b/src/index.ts @@ -72,6 +72,14 @@ export type GetConfig = $GetConfig | Ref<$GetConfig> export type TypeAllowed = undefined | null | string | number | boolean | Obj +type Params = (() => (Z | [...A])) | + ComputedRef | + Ref | + Z | + [...A] + +export type RequiredParams = Params, Required>; + export type GetReturn = { isPending: ComputedRef, data: ComputedRef, diff --git a/src/useAsync.ts b/src/useAsync.ts index 7bbea6d..fa471cd 100644 --- a/src/useAsync.ts +++ b/src/useAsync.ts @@ -7,7 +7,11 @@ import { } from 'vue'; import { Result } from '@/useResult'; import uuid from '@/_base/uuid'; -import type { TypeAllowed, UnwrappedPromiseType } from './index'; +import type { + TypeAllowed, + UnwrappedPromiseType, + RequiredParams, +} from './index'; type OnErrorCb = (e: null | Error, params: T) => unknown; @@ -15,26 +19,18 @@ type OnStartCb = (params: T) => unknown; type OnEndCb = (res: T, params: Z) => unknown; -// params: ComputedRef | Ref | (() => A) | A = {} as A, - -type Params = (() => (Z | [...A])) | - ComputedRef | - Ref | - Z | - [...A] - const useAsync = ( func: ((...args: A) => Promise) | ((args: Z) => Promise), - params?: Params, + params?: RequiredParams, enabled: Ref | (() => boolean) = ref(true), ): { isPending: Ref, data: ComputedRef>; error: Ref, reload: () => unknown, - onError: (cb: OnErrorCb>) => unknown, - onStart: (cb: OnStartCb>) => unknown, - onEnd: (cb: OnEndCb, Params>) => unknown, + onError: (cb: OnErrorCb>) => unknown, + onStart: (cb: OnStartCb>) => unknown, + onEnd: (cb: OnEndCb, RequiredParams>) => unknown, promise: ComputedRef>, } => { const isPending = ref(); @@ -43,20 +39,20 @@ const useAsync = ( const error: Ref = ref(null); - const onErrorList: Array>> = []; + const onErrorList: Array>> = []; - const onStartList: Array>> = []; + const onStartList: Array>> = []; - const onEndList: Array>> = []; + const onEndList: Array>> = []; // for legacy use case const d = ref>(null); const wrapParams = computed(() => { if (typeof params === 'function') { - return params(); + return params() as RequiredParams; } - return unref(params); + return unref(params) as RequiredParams; }); const lastUnwrapParams = ref(); @@ -69,7 +65,7 @@ const useAsync = ( }); // generate new xhr/promise - const _reload = (_params: Z | [...A]) => { + const _reload = (_params: RequiredParams) => { if (!_enabled.value) { return null; } @@ -80,7 +76,7 @@ const useAsync = ( error.value = null; // possible to call with rest params - const funcDefault = func as ((args: Z) => Promise); + const funcDefault = func as ((args: RequiredParams) => Promise); // call with only one param const funcRest = func as ((...args: A) => Promise); @@ -113,15 +109,15 @@ const useAsync = ( const reload = () => _reload(wrapParams.value); - const onError = (cb: OnErrorCb>) => { + const onError = (cb: OnErrorCb>) => { onErrorList.push(cb); }; - const onStart = (cb: OnStartCb>) => { + const onStart = (cb: OnStartCb>) => { onStartList.push(cb); }; - const onEnd = (cb: OnEndCb, Params>) => { + const onEnd = (cb: OnEndCb, RequiredParams>) => { onEndList.push(cb); }; diff --git a/src/useXhr.ts b/src/useXhr.ts index 16ec280..aa833d9 100644 --- a/src/useXhr.ts +++ b/src/useXhr.ts @@ -15,6 +15,7 @@ import type { GetConfig, GetReturn, Obj, + RequiredParams, TypeAllowed, XhrConfig, XhrGet, @@ -39,20 +40,15 @@ type $$GetConfigArg = Omit<$GetConfigArgs, 'url'> & { url?: string, } -type Params = (() => Z) | - ComputedRef | - Ref | - Z - // used as default `onError` const _blank = () => { }; -declare type UseXhr = Partial<{ +declare type UseXhr = Partial<{ // global callback for VueJS 2 plugin compatibility onError: OnErrorCb, - onStart: OnStartCb>, - onEnd: OnEndCb>, + onStart: OnStartCb>, + onEnd: OnEndCb>, onProgress: (e: ProgressEvent) => any, onAbort: (e: ProgressEvent) => any, // @@ -63,7 +59,7 @@ declare type UseXhr = Partial<{ const getTokenValue = (token: undefined | Token): undefined | null | string => unref(token); -export default function (args?: UseXhr) { +export default function (args?: UseXhr) { const { onError, onStart, @@ -90,9 +86,9 @@ export default function (args?: UseXhr) { /** * For GET it's possible to add cache */ - function get( + function get( parametersObj: GetConfig, - params?: Params, + params?: RequiredParams, enabled?: Enabled, ): GetReturn { const xhr: Xhr = new Xhr(); @@ -130,7 +126,7 @@ export default function (args?: UseXhr) { // use params from second args of get function if (!params) { - params = (unwrapParametersObj.params || {}) as Params; + params = (unwrapParametersObj.params || {}) as RequiredParams; } duration = unwrapParametersObj.cacheDuration; @@ -152,15 +148,15 @@ export default function (args?: UseXhr) { } // merge params - let p = unref(_getParams.params || params || {} as Params); + let p = unref(_getParams.params || params || {}); if (typeof p === 'function') { - p = (p as () => ZZ)(); + p = (p as () => ZZ)() as RequiredParams; } - _getParams.params = { - ...p as ZZ, + _getParams.params = ({ + ...p, ...(isRef(params) ? (params.value || {}) : params), - }; + }) as ZZ; url = typeof _url === 'function' ? _url(_getParams.params) : unref(_url); _getParams.url = url; @@ -285,7 +281,11 @@ export default function (args?: UseXhr) { }; } - const update = (method: 'post' | 'delete' | 'put', xhrConfig?: $UpdateConfigArgs, params?: Params) => { + const update = ( + method: 'post' | 'delete' | 'put', + xhrConfig?: $UpdateConfigArgs, + params?: RequiredParams, + ) => { const updateArgs = computed(() => { const _postArgs: $UpdateConfigArgs = {}; @@ -293,7 +293,7 @@ export default function (args?: UseXhr) { // use params from second args of post function if (!params) { - params = (unwrapParametersObj.params || {}) as Params; + params = (unwrapParametersObj.params || {}) as RequiredParams; } _postArgs.params = unref(params as ZZ); @@ -301,12 +301,6 @@ export default function (args?: UseXhr) { _postArgs.token = getTokenValue(token); } - // merge params - let p = unref(_postArgs.params || params || {} as Params); - if (typeof p === 'function') { - p = (p as () => ZZ)(); - } - _postArgs.url = unref(unwrapParametersObj.url); return _postArgs; @@ -344,11 +338,20 @@ export default function (args?: UseXhr) { }; }; - const post = (xhrConfig?: $UpdateConfigArgs, params?: Params) => update('post', xhrConfig, params); + const post = ( + xhrConfig?: $UpdateConfigArgs, + params?: RequiredParams, + ) => update('post', xhrConfig, params); - const put = (xhrConfig?: $UpdateConfigArgs, params?: Params) => update('put', xhrConfig, params); + const put = ( + xhrConfig?: $UpdateConfigArgs, + params?: RequiredParams, + ) => update('put', xhrConfig, params); - const _delete = (xhrConfig?: $UpdateConfigArgs, params?: Params) => update('delete', xhrConfig, params); + const _delete = ( + xhrConfig?: $UpdateConfigArgs, + params?: RequiredParams, + ) => update('delete', xhrConfig, params); if (!legacy) { onBeforeUnmount(() => {