typescript - 函数参数返回类型的打字稿类型推断
问题描述
在我的反应项目中,我用这种模式声明了我的 api 请求:
export type LoginApiResponse = {
token: string,
user: User
}
export function login(email: string, password: string): Promise<LoginApiResponse> {
return AuthService.signinWithEmailAndPassword(email, password)
}
我通过自定义钩子使用它们
export function useApi<T, Fn extends (...args: any[]) => Promise<T>>(
fn: Fn
) {
const [loading, setLoading] = useState(false);
const [error, setError] = useState();
const execute = async (...params: Parameters<Fn>) => {
setLoading(true);
try {
const result = await fn(...params);
setLoading(false);
return result;
} catch (err) {
console.warn("sideEfect execution error", err, JSON.stringify(err));
setError(err);
setLoading(false);
throw (error);
}
};
return { loading, execute, error };
}
像这样的实现
const loginExecutor = useApi<LoginApiResponse, typeof api.login>(api.login)
通过这种方式,我封装了给定 api 请求的加载和错误状态,而且我有完整的输入支持
问题
现在我的问题是:有没有办法利用 typescript 类型推断来推断 fn 函数的返回类型和参数类型,以便能够编写
useApi(api.login)
代替
useApi<LoginApiResponse, typeof api.login>(api.login)
同时保持相同的强类型?
解决方案
我看到您的示例推断出除了响应之外的所有内容。它有以下类型:
const loginExecutor = useApi(login)
const loginExecutor: {
loading: boolean;
execute: (email: string, password: string) => Promise<unknown>;
error: string;
}
我更新useApi
以单独提取参数和返回类型:
export function useApi<A extends any[], T>(
fn: (...args: A) => Promise<T>
)
所以现在我们得到以下类型:
const loginExecutor = useApi(login)
const loginExecutor: {
loading: boolean;
execute: (email: string, password: string) => Promise<LoginApiResponse>;
error: string;
}
请注意,我的示例在 TS >= 4 上进行了测试。
推荐阅读
- python - AES python解密和加密
- laravel - 数据被截断 - $faker->randomElements
- python - 使用循环确定 numpy 数组的最小值和最大值
- bash - 静默 /dev/tcp/host/port 重定向错误
- tensorflow - 如何像循环学习率一样做循环动量?
- python - 如何使用 Matplotlib 在 Python 中自动排序堆积条形图?
- python - Python3 - 从 Experta 导入时出现“NameError: ...”
- apache-spark - 基于给定的操作列创建一个新的数据集
- android - 如何在 Android 中对流式音频应用 3D 音频效果
- android - Flutter - 将文件保存到下载文件夹 - downloads_path_provider