Question

在此示例中 - https://react-router.now.sh/auth-workflow - 登录后，“登录”路线仍然匹配（通过在地址栏中输入地址或类似内容）。

除了创建像MatchWithAuthTestBefore之类的东西之外，是否有一个更优雅的解决方案，它需要渲染一对组件 - 一个在授权时，一个在没有时？

Answer 1

由于RRv4完全与组件有关，因此解决方案是在组件中处理此问题。基本上与用户登录时重定向的示例中列出的<MatchWhenAuthorized>组件相反。

const MatchWhenUnauthorized = ({ component: Component, ...rest }) => (
  <Match {...rest} render={props => (
    !fakeAuth.isAuthenticated ? (
      <Component {...props}/>
    ) : (
      <Redirect to={{ pathname: '/' }}/>
    )
  )}/>
)

这类似于您使用普通路由/视图配置所做的操作（匹配/login，如果用户已经过身份验证，您将在login视图中重定向。）

react-router v4 - MatchWhenAuthorized示例

1 个答案: