我的子组件是:
interface AuthContextType {
user: any;
signin: (user: string, callback: VoidFunction) => void;
signout: (callback: VoidFunction) => void;
}
let AuthContext = React.createContext<AuthContextType>(null!);
interface WithChildren {
children: ReactNode;
}
function AuthProvider(props:WithChildren) {
let [user, setUser] = React.useState<any>(null);
let signin = (newUser: string, callback: VoidFunction) => {
return authProvider.signin(() => {
setUser(newUser);
callback();
});
};
let signout = (callback: VoidFunction) => {
return authProvider.signout(() => {
setUser(null);
callback();
});
};
let value = { user, signin, signout };
return <AuthContext.Provider value={value}>{props.children}</AuthContext.Provider>;
}
我试着这样说:
<AuthProvider>
...
</AuthProvider>
我收到错误:
“JSX元素类型'AuthProvider'没有任何构造或调用签名。”
你能帮我解决这个问题吗?告诉我为什么会这样?如何在任何组件中调用带有子组件的 Package 器?
1条答案
按热度按时间ki0zmccv1#
我也解决了这个问题。我认为这是react版本的问题。这段代码我试着在react 18上运行。
我使用react.FC重新组织函数组件:
之前:
更改为:
我认为有些定义在react 18中发生了变化,比如在18版本之前,儿童道具已经被定义为React.fc类型中的可选属性。但在18版本中,它将react.fc删除了儿童道具。