在电子应用程序中单击菜单后发出事件时发生内存泄漏

2022-02-23 00:00:00 reactjs electron javascript typescript

我当前正在使用Electron and Reaction构建桌面应用程序。

现在我正在添加一个菜单功能,用于切换应用程序的黑暗模式。在我的Reaction应用程序中,我使用了一个切换黑暗模式的钩子。我希望在用户单击菜单项后立即触发该反应挂钩。

这是我到目前为止所做的工作:

菜单:

buildDefaultTemplate() {
    const templateDefault = [
      {
        label: '&File',
        submenu: [
          {
            label: '&Open',
            accelerator: 'Ctrl+O',
          },
          {
            label: '&Toggle Dark Mode',
            accelerator: 'Ctrl+T',
            click: () => {
              this.mainWindow.webContents.send('toggle-dark-mode', {
                message: 'Toggle successful!',
              });
            },
          },
          {
            label: '&Close',
            accelerator: 'Ctrl+W',
            click: () => {
              this.mainWindow.close();
            },
          },
        ],
      },
]

Dashboard.tsx:

export default function Dashboard(): ReactElement {
  const { username } = os.userInfo();
  const { toggleColorMode } = useColorMode();

  useEffect(() => {
    ipcRenderer.on('toggle-dark-mode', () => {
      toggleColorMode();
    });
  }, [toggleColorMode]);

切换它可以很好地工作。但是在多次重复该操作之后,我收到以下警告:MaxListenersExceededWarning:检测到可能的EventEmitter内存泄漏。11切换暗模式监听程序添加到[EventEmitter]。使用emitter.setMaxListeners()增加限制

我看到过类似的帖子,但答案并不令人满意。他们的建议是简单地停止听事件,我认为这在我的情况下是困难的。

我正在寻找在切换成功后取消订阅活动的方法。


解决方案

在启动电子应用时尝试设置一次toggle-dark-mode事件处理程序。

您的代码甚至不需要在ready事件中。

相关文章