reactjs中的泛型类型
我编写了一个自定义钩子来处理我的应用程序中的输入。我使用泛型类型来定义自定义钩子返回的类型。以下是我的代码
interface IUseInput<T, U> {
(): [T, (e: ChangeEvent<HTMLInputElement>) => void, U];
}
function useInput<T, U>(): IUseInput<T, U> {
const [input, setInput] = useState({});
const [isDirty, setDirty] = useState({});
const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
setInput({
...input,
[e.target.name]: e.target.value
});
setDirty({
...isDirty,
[e.target.name]: true
});
};
return [input, handleInputChange, isDirty] //this line get error
}
const Component: React.FC = () => {
const [input, handleChangeInput, isDirty] = useInput<{username: string, password: string}, {username: boolean, password: boolean}>();
return (
....
)
}但是我得到了这个错误Type '{}[]' is not assignable to type 'IUseInput<T, U>
WHere是我的错吗？请帮帮我
回答 1
Stack Overflow用户
回答已采纳
发布于 2020-02-13 16:24:32
IUseInput<T, U>是函数的类型，不是返回类型的类型。没有办法指定函数声明的类型，只能指定变量的类型(您可以将函数赋给该变量)。然而，这并不是真正必要的，我只是将返回类型从IUseInput转移到函数声明。
由于U应该与T具有相同的键，因此可以进行改进，您可以使用预定义的映射类型Record从T派生U。因此，您可以用Record<keyof T, boolean>替换U
function useInput<T>(): [T, (e: ChangeEvent<HTMLInputElement>) => void, Record<keyof T, boolean>] {
const [input, setInput] = useState({} as T);
const [isDirty, setDirty] = useState({} as Record<keyof T, boolean>);
const handleInputChange = (e: ChangeEvent<HTMLInputElement>) => {
setInput({
...input,
[e.target.name]: e.target.value
});
setDirty({
...isDirty,
[e.target.name]: true
});
};
return [input, handleInputChange, isDirty]
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/60211843
复制相关文章
相似问题
joomla sql架构中缺少的字段
用数据库Joomla文章/模块位置的数据填充字段？
Sql获取字段的字符位置
Joomla PHP文件位置
设置数据库链接时Crystal Reports SQL文件中缺少的字段
添加站长 进交流群
领取专属 10元无门槛券
AI混元助手 在线答疑
关注 腾讯云开发者公众号
洞察 腾讯核心技术
剖析业界实践案例
腾讯云开发者
