Обратный путь по умолчанию к частному маршруту и ​​наоборот

Question

в моем приложении вы можете войти на главную страницу только после авторизации, соответственно, страница входа всегда первая, если пользователь не авторизован, у меня есть приватные маршруты, которые не разрешены, если пользователь не авторизован, и однанормальный маршрут к странице входа в систему, так как будет много частных маршрутов, я хотел бы сделать что-то, например, обратный, т. е. я бы использовал частный маршрут один раз, и на других страницах, которые требуют авторизации для перехода туда, поставьтеобычный маршрут, как этого достичь?

const PrivateRoute = ({store, component: Component, ...rest}) => {
  return (
     <Route
       {...rest}
       render={(props)=>
        localStorage.getItem("token") ? (
           <Component {...props} />
        ) : (
           <Redirect
              to={{
                pathname: "/login",
                state: { from: props.location },
              }}
            />
         )
       }
    />
 )

 export const Routes = () => {
    return (
       <Switch>
          <Route exact path="/" component={Login} />
          <PrivateRoute path="/homepage" component={Homepage} />
          {/* ...more PrivateRoutes */}
       </Switch>
      );
   };

Мне нужно что-то вроде этого

<PrivateRoute exact path="/" component={Login} />
<Route path="/homepage" component={Homepage} />
{/* ...more Routes*/}```

Answer 1

Похоже, ваша основная цель - уменьшить использование переменной PrivateRouter, поэтому вы можете попробовать этот подход: использовать разные маршруты для зарегистрированного / незарегистрированного пользователя

const App = () => {
  const [loggedIn, setLoggedIn] = useState(false);

  useEffect(() => {
    // check if user is logged in
  }, []);

  return (
    <Switch>
      {!isLoggedIn ? (
        <>
          <Route exact path="/" component={Login} />
        </>
      ) : (
        <>{/* Routes for logged user*/}</>
      )}
    </Switch>
  );
};
``