Question

每次刷新页面时，我都试图调用一个函数。我正在执行以下操作：

componentDidMount() {
  this.props.fetchData(this.state.data);
  window.addEventListener('beforeunload', this.handleRefresh);
}

componentWillUnmount() {
  window.removeEventListener('beforeunload', this.handleRefresh);
}

我要调用的函数如下：

  handleRefresh = () => {
    // refreshPage here is an action method that talks to the backend
    this.props.refreshPage(this.props.some_data)
  }

这里的问题是，刷新页面的前几次，我在后端获得了预期的输出。几次之后，刷新页面似乎根本不会触发backend方法。这是触发并获得刷新事件的正确方法吗？

Answer 1

为什么要使用事件监听器？ React提供了在页面生命的特定阶段触发的“生命周期方法”。如果您希望每次刷新页面时都调用一个函数，只需将函数放在componentDidMount或类构造函数中即可。只要页面加载，这些命令就会执行。参见https://reactjs.org/docs/state-and-lifecycle.html#adding-lifecycle-methods-to-a-class

componentDidMount() {
  this.props.refreshPage(this.props.some_data);
}

fetchData的目的是什么？您似乎正在运行该函数，但对其返回值不做任何事情。

React.js：beforeunload未能按预期触发

1 个答案: