@Mindgrow

Как лучше реализовать защищённый react router?

Используют React 16.14
Нужно сделать так, чтобы при переходе на определённые роуты, если пользователь не авторизован - выполнялся переход на роут по умолчанию.
Пока нашёл только это https://www.makeuseof.com/create-protected-route-i...
подозрительно что редирект выполняется не с помощью хуков.
Какой есть более современный способ реализации?
  • Вопрос задан
  • 110 просмотров
Решения вопроса 1
vovvkka
@vovvkka
Я использую так, если пользователя нет в стейте, то проверка не срабатывает, и производится редирект на ту страницу, которую я передал пропсом как redirectTo, а если пользователь есть, то он просто возвращает обычный роут.

const ProtectedRoute = ({isAllowed, redirectTo, ...props}) => {
    return isAllowed ?
        <Route {...props}/> : <Redirect to={redirectTo}/>
};

const App = () => {
    const user = useSelector(state => state.users.user);

    return (
        <Switch>
            <ProtectedRoute
                isAllowed={user}
                redirectTo="/"
                path="/new-artist"
                component={NewArtist}
            />
          
            <Route path="/register" component={Register}/>
            <Route path="/login" component={Login}/>

            <Route component={() => <h2>Not Found.</h2>}/>
        </Switch>
    );
};
Ответ написан
Комментировать
Пригласить эксперта
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы
06 дек. 2022, в 22:59
1300 руб./за проект
06 дек. 2022, в 22:21
5000 руб./за проект
06 дек. 2022, в 20:37
10000 руб./за проект