react-router redirect在受保护路由中不呈现任何内容



我已经保护路由命名为<LoggedRoutes/>,应该重定向和渲染我的<Onboarding/>组件,如果用户没有完成他的登机。但组件不是渲染,而我的<Login/>组件是渲染,如果我没有记录。我不明白为什么。请注意,重定向是有效的,因为当我试图到达/edit时,我被重定向到/onboarding

任何想法为什么我的<Onboarding/>组件不渲染?提前感谢!下面是代码:

const LoggedRoutes = ({ component: RouteComponent, ...rest }) => {
const { currentUser } = useContext(AuthContext);
const onboarding = false;
return (
<Route
{...rest}
render={routeProps =>
!!currentUser && onboarding ? (
<RouteComponent {...routeProps} />
) : !!currentUser && !onboarding ? (
<Redirect to={"/onboarding"} />
) : (
<Redirect to={"/login"} />
)
}
/>
);
};

提前感谢!

不确定,但试试这个:

const LoggedRoutes = ({ component: RouteComponent, ...rest }) => {
const { currentUser } = useContext(AuthContext);
const onboarding = false;
return (
<Route
{...rest}
render = { routeProps => (
currentUser && onboarding ? ( <RouteComponent {...routeProps} /> ) :
currentUser && !onboarding ? ( <Redirect to={"/onboarding"} /> ) :
( <Redirect to={"/login"} /> )
)}
/>
);
};

将onboarding硬编码为false,下面的语句是这样的

currentUser && false  ? ( <RouteComponent {...routeProps} /> ) :
currentUser && true ? ( <Redirect to={"/onboarding"} /> ) :
( <Redirect to={"/login"} /> )

,

false  ? ( <RouteComponent {...routeProps} /> ) :
currentUser  ? ( <Redirect to={"/onboarding"} /> ) :
( <Redirect to={"/login"} /> )

所以它只取决于currentUser的值。检查其值是否为null/undefined

相关内容