javascript - 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 "/"

重定向.js

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

还有别的办法吗？

Answer 1

是的，您可以实现这种重定向。

由于路由时可以传递数据，因此可以将上一个URL传递给该组件，以替换/，实现返回上一个页面。

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

剩下的唯一事情就是根据代码需求将其设为通用组件，或者用于auth检查的HOC。

<小时/>

在线尝试: