javascript - 当在同一路径上访问时， react 路由器链接不会引起重新渲染

我正在使用React Router v4，重新加载页面时遇到了一些问题(不是window.location.reload)。我最好给出一个实际的用例来解释这个问题，我们以一个社交网络应用程序为例:

用户A评论了用户B的帖子，用户B页面上出现一条通知。

用户B单击该通知，我们执行this.props.history.push('/job/' + id')，它起作用了，因此用户B转到job/123页面。

用户A再次评论，新通知出现在用户B页面中，而用户B仍保留在job/123页面上，他单击了通知链接并触发了this.props.history.push('/job' + id')。但是他不会看到页面重新呈现，他没有看到最新评论，因为页面没有任何作用。

最佳答案

在许多情况下，这似乎是常见的情况。可以使用许多不同的方法来解决它。检查此stackoverflow question。有一些很好的答案和发现。就我个人而言，this approach更有意义。

每当用户尝试在页面之间导航时，即使在同一location.key中，route也会每次更改。要在/jod/:id组件中的代码块下面测试此位置:

componentDidUpdate (prevProps) {
    if (prevProps.location.key !== this.props.location.key) {
      console.log("... prevProps.key", prevProps.location.key)
      console.log("... this.props.key", this.props.location.key)
    }
  }

我也有同样的情况。 componentDidUpdate中的更新状态。之后，按预期工作。单击同一路线内的项目会更新状态并显示正确的信息。

我假设(不确定您如何传递/更新/job/:id中的注释)是否可以在/job/:id组件中设置类似的内容:

componentDidUpdate (prevProps) {
    if (prevProps.location.key !== this.props.location.key) {

      this.setState({
        comments: (((this.props || {}).location || {}).comments || {})
      })
    }
  }

关于javascript - 当在同一路径上访问时， react 路由器链接不会引起重新渲染，我们在Stack Overflow上找到一个类似的问题：https://stackoverflow.com/questions/52099437/