Question

我在网站上使用React Router。我有主页和联系方式。

当我进入主页时，我再次单击主页。如何重新加载Facebook之类的页面

在这里发出：https://github.com/ReactTraining/react-router/issues/1982

Answer 1

查看问题后，我可以意识到您可以使用强制更新：

componentDidUpdate(prevProps) {
    if (this.props.location !== prevProps.location) {
      this.forceUpdate();
    }
  }

Answer 2

您可以在“主页”链接上设置事件处理程序，该事件处理程序将提取您要更新的数据。

      class Nav extends React.Component {
  constructor () {
    super()
    this.handleClick = this.handleClick.bind(this)
  }
  handleClick () {
    // code that fetches Home Page data
  }
  render () {
    return (
      <Link to='your/path' onClick={this.handleClick}>Home</Link>
    )
  }
}

Answer 3

这可能是一个普遍的问题，我一直在寻找下一次在我的工具表中提供一个不错的解决方案。 React-Router 提供了一些机制来知道用户何时尝试访问任何页面，甚至是已经访问过的页面。

读取location.key哈希是一种完美的方法，因为每次用户尝试在任何页面之间导航时，它都会更改。

componentDidUpdate (prevProps) {
    if (prevProps.location.key !== this.props.location.key) {
        this.setState({
            isFormSubmitted: false,
        })
    }
}

参考：A location object is never mutated so you can use it in the lifecycle hooks to determine when navigation happens

React-Router <link />以加载页面，即使我们已经在该页面上

3 个答案: