Open CurryPaste opened 2 years ago
新特性使用场景 目前 useAsync 可以更新异步函数的 状态loading 和 数据response
useAsync
状态loading
数据response
想法 再新增一个可选参数 minTime 最小执行时间
minTime 最小执行时间
useWaitTime
不算是解决痛点,只是拓展了功能
新功能 (在原有的功能上拓展新功能)
demo 这个例子,只做展示用,所以只处理了loading export const useWaitAsync = <T>(fun: ()=>Promise<T>, minTime: number) => { /** 这个函数是为了保证首页不会loading太快 */ const data = ref< T | undefined>(); const loading = ref(true); const error: {code?: string, message?: string} = {}; let loadingTemp = true; const promise = () => new Promise<void>((reslove, reject) => { fun().then((res: T) => { // 这里不再直接赋值,而是先暂存 data.value = res; error.code = '0'; error.message = ''; // loading.value = false; loadingTemp = false; reslove(); }).catch((err: string) => { data.value = undefined; error.code = '999999'; error.message = err; // loading.value = false; loadingTemp = false; reject(); }); }); useWaitTime(() => promise(), minTime, () => { // 满足最小时间后,再进行赋值,保证最小执行时间 loading.value = loadingTemp; }); return { data, loading, error, }; };
使用场景
新特性使用场景 目前
useAsync
可以更新异步函数的状态loading
和数据response
想法 再新增一个可选参数
minTime 最小执行时间
useWaitTime
类似,给异步函数设置一个最小执行时间useWaitTime
相同,控制loading的最小展示时间类型
新功能 (在原有的功能上拓展新功能)
参数、回调或其他补充