Как мы можем достичь перенаправления с помощью Reaction-router-DOM?

Question

Я пытался использовать

<Redirect to = 'loginPage' />

но это никуда меня не перенаправляет. что я должен делать?

Пожалуйста, помогите мне

Answer 1

У вас есть два варианта перенаправления:

Вариант 1:

Использование <Redirect /> как в этом примере:

<Redirect
  to={{
    pathname: '/loginpage'
  }}
/>

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

Вариант 2:

Использование this.props.history.push("/loginpage"); как в этом примере:

  componentDidUpdate() {
    if (this.props.authenticated === false) {
      this.props.history.push("/loginpage");
    }
  }

Обратите внимание, что для использования этой опции компонент должен быть дочерним компонентом <BrowserRouter />. В противном случае вы должны использовать withRouter() HOC, как в этом примере:

myComponent = withRouter(
  ServicePlanSelect
);