useURLLoader改写成泛型形式报错
来源：3-12 自定义 hook 第三部分 - 正确的方式完成 URLLoader
tyler4400
2020-04-09
// 我是想直接这么用的，不想用as const [dogResult, loading] = useURLLoader<IShowResult>(url, [show]);
就把useURLLoader改成泛型的了，怎么让这里不报错？
试着改成useState也不行。
const useURLLoader = function (url: string, deps: any[] = []): [T, boolean]{
const [data, setData] = useState(null);
const [loading, setLoading] = useState(false);
useEffect(() => {
setLoading(true);
axios.get(url).then(result => {
setData(result.data);
}).finally(() => setLoading(false));
}, deps);
return [data, loading];
}
export default useURLLoader;
另外我把泛型函数改成箭头函数就报错了，但我看ts文档就是这么用的
//第九行
const useURLLoader = (url: string, deps: any[] = []): [T, boolean] => {
写回答
1回答
-
同学你好 非常好的改进
第一个问题 因为初始值是 null，而你传入了泛型T，所以造成了 不匹配，这时候可以用联合类型
const [data, setData] = useState<T | null>(null) //这样也很好，使用的时候可以需要判断 data 是否存在 if (data) { //这时候 data 已经是 T 类型了 }第二个原因是 tsx 搞的鬼，因为jsx 也是用 <>开闭标签的，会让编译器混乱,可以使用一个小hack
// 这两种都可以 const useURLLoader = <T extends {}> const useURLLoader = <T extends any>412020-04-18
相似问题