Как правильно реализовать Route для данного случая?

Question

[Vann Damm]

Как редеректить(не давать переходить) по урлу "/auth" ?
Есть роут "/auth" который рендерит компонент , у которого есть свои роуты.

<Route 
            path={"/auth"}
            component={AuthPage}
          />

Если я перехожу на роут "/auth" он соответсвенно рендерит пустую страницу. Я попробовал это решить редиректом определенный роут, после добавления роутов в компоненте AuthPage - это работает некорректно.
Как решить данную проблему?

Answer 1

[Валерий]

Вам нужно определиться со случаем, когда переход по урлу /auth должен резолвиться редиректом. К примеру - когда пользователь уже авторизован. Далее вам нужно создать компонент обертку типа:

const PublicRoute = ({component: Component, isLogin, ...rest}) => {
    return (
        <Route {...rest} render={props => (
            isLogin ?
                <Redirect to="нужный урл" />
            : <Component {...props} />
        )} />
    );
};

Использование

<BrowserRouter>
  <Switch>
    <PublicRoute component={SignIn} isLogin={...} path="/auth" exact />
  </Switch>
</BrowserRouter>

Comments

[Vann Damm]

Вариант хороший, но мне нужно редиректить на роут , который рендерит Component. т.е он не сможет редиректнуть т.к роуты не отрендерились т.к условие не совпало. Как быть в таком случае?