Reactjs 如何在React功能组件中返回不同的页面

我正在创建一个react应用程序，当我的应用程序启动时，我想知道用户是否已登录并将其发送到主页。 当我的应用启动时“/”路由加载此页面

import React from 'react';
import { Redirect } from 'react-router';
import { LocalStorageService } from "../services/localData-service";


const HomeOrLogin : React.FC = () => {
    /*If User is logged then, redirect to home, if not redirect to slides tutorial*/ 
    const storageService = new LocalStorageService();
    // Check if exits jwt in the phone
    storageService.getItem("jwt")
        .then((token )=>{
            /* If exists the jwt in the phone the user is logged */ 
            if(token){
                return <Redirect to="/Home" /> 
            }else{
                return <Redirect to="/slides" />
            }               
        })
        .catch((err)=>{
                console.log(err);
        })
};

export default HomeOrLogin;

从“React”导入React；
从“react router”导入{Redirect}；
从“./services/localData service”导入{LocalStorageService}；
常量同源逻辑：React.FC=（）=>{
/*如果用户已登录，则重定向至主页，如果未登录，则重定向至幻灯片教程*/
const storageService=new LocalStorageService（）；
//检查手机中是否存在jwt
storageService.getItem（“jwt”）
。然后（（令牌）=>{
/*如果手机中存在jwt，则会记录用户*/
如果（令牌）{
返回
}否则{
返回
}               
})
.catch（（错误）=>{
控制台日志（err）；
})
};
导出默认的HomeOrLogin；

但它显示了组件中的一个错误

Type '() => void' is not assignable to type 'FC<{}>'.
  Type 'void' is not assignable to type 'ReactElement<any, any> | null'.

Type'（）=>void'不可分配给Type'FC'。
类型“void”不可分配给类型“ReactElement | null”。

您是否考虑过在componentDidMount中执行异步请求，然后返回一个或另一个屏幕

import React, { useState, useEffect } from 'react';

const HomeOrLogin : React.FC = () => {
    const [ redirect, setRedirect ] = useState(null);
    /*If User is logged then, redirect to home, if not redirect to slides tutorial*/ 

    useEffect(() => {
        const storageService = new LocalStorageService();
            // Check if exits jwt in the phone
            storageService.getItem("jwt")
                .then((token )=>{
                /* If exists the jwt in the phone the user is logged */ 
                    if(token){
                        setRedirect('/Home');
                    }              
                })
                .catch((err)=>{
                    console.log(err);
                })
    }, []);

    if (redirect) 
        return <Redirect to={redirect} />
    }
    return (
        <Redirect to="/slides" />
    )

 };

import React，{useState，useffect}来自“React”；
常量同源逻辑：React.FC=（）=>{
const[redirect，setRedirect]=useState（null）；
/*如果用户已登录，则重定向至主页，如果未登录，则重定向至幻灯片教程*/
useffect（（）=>{
const storageService=new LocalStorageService（）；
//检查手机中是否存在jwt
storageService.getItem（“jwt”）
。然后（（令牌）=>{
/*如果手机中存在jwt，则会记录用户*/
如果（令牌）{
setRedirect（'/Home'）；
}              
})
.catch（（错误）=>{
控制台日志（err）；
})
}, []);
如果（重定向）
返回
}
返回(
)
};

---

这样，如果有一个令牌，你将被重定向到主页，否则就被重定向到/slides。

嗨，我是react中的新手，

找不到名称“componentDidMount”。

可能是因为我在用ionic react进行构建？对不起，兄弟，你使用的是functinal组件，我会编辑它的。没问题，伙计！