ReactJS, перенаправление после рендера

Question

Есть ли способ или как я могу перенаправить после некоторого return на render?

Я хочу сделать что-то вроде этого:

render() {
  return(<div>You have no access</div>)
  // then redirect to "/"

Я думал при создании компонента, который имеет перенаправление только в componentDidMount через 3 секунды, например с именем <Redirect>, затем используйте его следующим образом:

render() {
  return(<Redirect time=3> <div>You have no access</div> </Redirect>
  // then redirect to "/"

Redirect. js

componentDidMount() {
  // code for redirect using with this.props.time

Есть ли другой способ?

Answer 1

Да, вы можете добиться такого рода перенаправления.

Поскольку вы можете передавать данные во время маршрутизации, можно передать URL-адрес prev этому компоненту, чтобы заменить /, получив return to prev page.

componentDidMount() {
  const intervalId = setInterval(this.timer, 1500);
  this.setState({ intervalId: intervalId });
}
componentWillUnmount() {
  clearInterval(this.state.intervalId);
}
timer = () => {
  this.props.history.push("/");
};

. осталось сделать его общим компонентом или HO C для проверки auth, основываясь на требовании кода.

---

Попробуйте онлайн: