React Router更改参数不会触发componentWillRecieveProps

Question

问题:更改<Route />组件的参数不会更新它正在呈现的组件.路径更改显示在URL栏中,但直接呈现{this.props.match.params.id}显示旧:idURL而不是URL栏中反映的新值.

更新:我通过将<BrowserRouter />index.js文件中的out移出到App.js文件中来解决此问题.它不再是Provider的直接子节点,而是App组件的子节点.不知道为什么这会让一切都突然发挥作用.

我在做什么:我有一个<Link to="/user/11" />从user/7(或任何当前的ID)到a/user/11

将componentWillReceiveProps(newProps)它呈现不发射,该成分(此元件使用连接react-redux有没有什么帮助任何.我试图将withRouter周围的连接,并没有帮助)

如果我在chrome中手动刷新页面(使用CTRL-R或刷新按钮),页面将显示新数据,呈现"新"参数.

TLDR:从切换/user/7到/user/11不会触发该componentWillRecieveProps功能,从而使组件显示旧状态

问题:我在这里做错了什么导致componentWillReceiveProps不开火.

我正在使用react-router v4和最新的create-react-app

这是我的CWRP功能:

componentWillReceiveProps(newProps) {
  console.log("getProps")

  this.props.getUser(newProps.match.params.id)

  if (newProps.match.params.id == newProps.currentUser.id) {
    this.setState({ user: "currentUser" })
  } else {
    this.setState({ user: "selectedUser" })
  }
}

这是我的组件的完整代码:https://gist.github.com/Connorelsea/c5c14e7c54994292bef2852475fc6b43

我在这里遵循解决方案,它似乎对我不起作用.路径参数更改时,组件不会重新装入

Answer 1

你需要使用React Router Redux