Question

调用已注册的事件侦听器的回调函数时，出现以下错误：“警告：无法对已卸载的组件执行React状态更新。这是无操作，但是表示您的应用程序中存在内存泄漏...等等。如果您引用该代码，则在调用回调函数时，将两次调用日志语句“验证配置”。具体来说，它记录“验证配置”，然后设置状态更新会导致上述警告，然后再次记录“验证配置”。但是，从我的日志语句中，我知道一个事实，即事件监听器仅被触发一次。

接下来，但类似的问题，在reloadData函数中，我注册了另一个事件侦听器，以在蓝牙进程完成时接收通知，并在每次响应后调用特定函数。但是，由于这种内存泄漏，这些函数被多次调用，所以最终每个调用中都有几个被淹没。

我在下面粘贴了相关代码。我一直在寻找一种解决方案，但似乎找不到。任何建议/帮助将不胜感激。如果我的描述令人困惑，我可以尝试进一步解释。

sync = async() => {
  // other relevant async code
  device.sendConfiguration()
  EventRegister.addEventListener('synccomplete', this.verifyConfiguration)
}

verifyConfiguration = async() => {
  const {device, configuration} = this.props
  const {apiClient} = this.state

  console.log('Verify Configuration')

  EventRegister.removeEventListener('synccomplete')

  this.setState({progressText: 'Verifying configuration', progress: 0.60, syncStage: 2})

  const responseStatus = await apiClient.verifyDeviceConfiguration(configuration, esn)

  if (responseStatus === 204) {
    this.reloadData()
  } else {
    // display issue
  }
}

reloadData = async() => {
  const {device} = this.props

  this.setState({progressText: 'Reloading data', progress: 0.80})
  device.getInfo()
  // device will send respective responses for each fxn
  EventRegister.addEventListener('reloadComplete', async(cmd) => {
    switch (cmd) {
      case 'resp1':
        device.getInfo_2()
        break
      case 'resp2':
        device.getInfo_3()
        break
      case 'resp3':
        device.getInfo_4()
        break
      default: break
    }
  })
}

如上所述，我将得到一个队列，最终将看起来像这样：[getInfo（），getInfo（），getInfo_2（），getInfo_2（），getInfo_2（），getInfo_2（），getInfo_3（），getInfo_3 （），依此类推...]

我已经假定我将不得不为事件监听器重构reloadData中的回调函数，但是我正在寻找有关正确方法的建议...

谢谢。

如何使用回调函数修复反应本机事件侦听器上的内存泄漏

0 个答案: