如何从ipcRenderer.on事件侦听器注销?

时间:2019-08-08 18:10:53

标签: javascript node.js angular electron ipcrenderer

在主机应用程序中,我有一个按钮,单击该按钮会将数据连同数据发送到我的角度应用程序。像这样:

<button (click)="onClick()">Send Some Data</button>

组件:

onClick() {  
ipcRenderer.send("data-bridge",{name: 'John Smith', address: 'Main Street', date: new Date() );
}

在我的有角度的应用程序中,我正在接收这样的数据:

import { ElectronService } from 'ngx-electron';

export class AppComponent {
  constructor( private electronService: ElectronService) {}

   ngOnInit() {
    if (this.electronService.ipcRenderer) {

      this.electronService.ipcRenderer.on('data-bridge', (event, data) => {
            console.log('got something', data)
        })
    }
  }
}

我注意到的行为是,在单击按钮x次后,我将看到警报x次:

  • 单击1-> 1条警报
  • 2点击-> 2警报
  • 3单击-> 3警报。等等等等

因此,这显然向我表明内存泄漏。解决方案很简单,请在收到事件后删除事件侦听器。

我尝试做类似的事情:

this.electronService.ipcRenderer.on('data-bridge', (event, data) => {
        alert('got something');
        this.electronService.ipcRenderer.removeAllListeners()
}

但是单击一次仍然会出现多个警报。

我不能使用ipcRenderer.once方法,因为我需要侦听器保持打开状态,只是不能有多个相同的侦听器。如何删除ipcRenderer.on('data-bridge',...)事件侦听器,以便每次单击按钮时,我只有一个事件侦听器?

1 个答案:

答案 0 :(得分:0)

ipcRendererEventEmitter类,因此您可以使用removeListener(eventName, listener)(或off)方法。

这应该有效

// on construct
this.onData = (event, data) => {
  console.log('got something', data)
})
// on init
ipcRenderer.on('data-bridge', this.onData)
// on deconstruct
ipcRenderer.removeListener('data-bridge', this.onData)