什么时候可以在React组件生命周期中执行路线更改？

Question

我有某种向导，每个步骤都有自己的路线。 现在，当用户使用直接链接到第二步路线时，我想将他重定向到第一步（使用browserHistory.replace）。

我面临的问题是我真的不知道应该在组件生命周期的哪个阶段执行。 我已经尝试过constructor ， render ， componentWillMount ，但是即使使用路由器，所有这些也都不能阻止组件的呈现。 因此发生的事情是发生了重定向，但是前一条路由中的组件仍然获得渲染并且失败了（显然没有数据）。

在组件初始化期间是否有任何“适当”的重定向方式（我需要检查状态）？ 还是有其他更好的方法呢？

Answer 1

我不知道“官方”推荐的方式（如果有人可以找到，还是很感兴趣），但是对我有用的是：

1. 在componentWillMount期间重定向
2. 在渲染期间，使用与componentWillMount相同的条件以返回null

例：

class MyComponent extends Component {

  componentWillMount() {
    if (!this.props.data) {
      browserHistory.replace(myRoute);
    }
  }

  render() {
    if (this.props.data) {
      return (
        <div>
        ...
        </div>
      );
    }

    return null;
  }
}

Answer 2

在v2 / 3中，您应该使用onEnter函数进行重定向（使用replace函数）。 v2 / 3复制了大多数React生命周期功能，因为它实际上并没有使用React来渲染路由组件。 也就是说， <Route>仅用于配置， react-router生成给定路由的组件数组，并分别渲染每个组件。

function redirectToStart(nextState, replace) {
  if (!nextState.someCondition) {
    replace('/initial-page')
  }
}

<Route onEnter={redirectToStart} ... />