Как защитить отдельный маршрут отдельно от маршрутов в React Router v5? - PullRequest
Новая
       3

Как защитить отдельный маршрут отдельно от маршрутов в React Router v5?

0 голосов
/ 27 февраля 2020

Я построил ProtectedRouteWrapper и обернул его вокруг маршрута, который я хочу защитить - /path/protected

Однако у меня также есть настройка маршрута с использованием параметров - /path/:params, и хотя у меня нет Обертка вокруг этого маршрута, она также защищена.

У кого-нибудь есть идеи, как это исправить?

Container.jsx 

      <Switch>
        <ProtectedRouteWrapper scope='protected'>
          <Route path={`${path}/protected`}>
            {this.props.isFetching ? (<Spinner />) : (
              <>
                <HeaderContainer
                  displayName={this.state.displayName}
                  isLoggedIn={this.props.isSignedIn}
                  />
                <ProtectedContainer
                  state={this.props.state}
                  onReturnPath={this.props.onReturnPath}
                  returnPath={this.props.returnPath}
                  sessionData={this.props.sessionData} 
                  />
              </>
            )}
          </Route>
        </ProtectedRouteWrapper>

        <Route path={`${path}/:params`}>
          {this.props.isFetching ? (<Spinner />) : (
            <>
              <HeaderContainer  
                displayName={this.state.displayName}
                isLoggedIn={this.props.isSignedIn} 
                />
              <LayoutContainer
                displayName={this.state.displayName}
                {...this.props} 
                />
            </>
          )}
        </Route>


      </Switch>

ProtectedRouteWrapper.jsx 

const ProtectedRouteWrapper = ({ children, scope, ...rest }) => {
  const isSignedIn = useSelector(state => state.session.userData.signed_in);

  return (
    <Route
      {...rest}
      render={({ location }) =>
        isSignedIn === true ? ( children ) : <LoginContainer scope={scope} />
      }
    />
  );
};
...