React组件内的setInterval和热重新加载(Webpack)

Question

我想在React组件中反复调用一个函数，从它装载的时候开始，直到它卸载为止，并使它与webpack HMR (热重新加载)一起工作。

最简单的方法是按照ReactJS文档中的建议在componentDidMount中设置一个间隔: 1：https://facebook.github.io/react/docs/component-specs.html#mounting-componentdidmount

componentDidMount () {
  const number = Math.floor(Math.random() * 1000) + 1
  setInterval(() => console.log('Component ' + number.toString()), 5000)
}

我已经找过了，但是找不到一个解决方案来清除这个间隔，在webpack HMR为我们更新的组件调用componentDidMount之前。这意味着每次模块热重新加载时，我们都有一个新的时间间隔。

注意:在Webpack反弹之前，不会调用componentWillUnmount

更新:重新绑定应该在正确设置HMR时调用componentWillUnmount

用webpack HMR实现重复延迟函数调用的最佳方式是什么？

Answer 1

对不起，我刚刚发现问题出在我的webpack HMR实现上，它没有显式卸载热路由。

如果碰巧遇到同样的问题，您可能需要检查此提交，查看src/main.js diff文件：https://github.com/davezuko/react-redux-starter-kit/commit/a602625b20ade172c829b583882ae44c150e738c