Depending on whether the user is registered or not, the registration or home must be shown in the url “/”
I get an error at the line:
<Route path="/" component= {Home} exact={true}/>
What could be the problem?
No overload matches this call. Overload 1 of 2, ‘(props: Readonly): Route’, gave the following error. Type ‘() => JSX.Element | undefined’ is not assignable to type ‘ComponentClass<any, any> | FunctionComponent | ComponentClass<RouteComponentProps<any, StaticContext, unknown>, any> | FunctionComponent<…> | undefined’. Type ‘() => JSX.Element | undefined’ is not assignable to type ‘FunctionComponent’. Type ‘Element | undefined’ is not assignable to type ‘ReactElement<any, any> | null’. Type ‘undefined’ is not assignable to type ‘ReactElement<any, any> | null’. Overload 2 of 2, ‘(props: RouteProps, context?: any): Route’, gave the following error. Type ‘() => JSX.Element | undefined’ is not assignable to type ‘ComponentClass<any, any> | FunctionComponent | ComponentClass<RouteComponentProps<any, StaticContext, unknown>, any> | FunctionComponent<…> | undefined’. Type ‘() => JSX.Element | undefined’ is not assignable to type ‘FunctionComponent’.ts(2769) index.d.ts(88, 5): The expected type comes from property ‘component’ which is declared here on type ‘IntrinsicAttributes & IntrinsicClassAttributes & Readonly & Readonly<…>’ index.d.ts(88, 5): The expected type comes from property ‘component’ which is declared here on type ‘IntrinsicAttributes & IntrinsicClassAttributes & Readonly & Readonly<…>’
This is the code:
const App: React.FC = () => {
const [isReg, setIsReg] = useState(false);
useEffect(() => {
if(getItem("isRegistered")==null){
console.log(getItem("isRegistered"));
setIsReg(true);
}
else{
setIsReg(false);
}
}, []);
if(isReg){
return (
<IonApp>
<IonReactRouter>
<IonSplitPane contentId="main" when="(min-width: 4096px)">
<Menu />
<IonRouterOutlet id="main">
<Route path="/" component= {Registro } exact={true}/>
</IonRouterOutlet>
</IonSplitPane>
</IonReactRouter>
</IonApp>
);
}
else{
return (
<IonApp>
<IonReactRouter>
<IonSplitPane contentId="main" when="(min-width: 4096px)">
<Menu />
<IonRouterOutlet id="main">
<Route path="/" component= {Home} exact={true}/>
</IonRouterOutlet>
</IonSplitPane>
</IonReactRouter>
</IonApp>
);
}
};
1 post - 1 participant