如何在电子中取消注册上下文菜单监听器

Question

我之前写过这个问题 and created this issue in the context menu module for electron。

尽管我上面的问题很详细，但没有得到回复。然后，@sindresorhus 建议我在 Whosebug 上问这个问题：

如何在 electron 中注销上下文菜单？我有一个程序，根据您点击的位置，会显示不同的上下文菜单：

  handleContextMenu() {
    this.props.contextMenu({
      prepend: (params, browserWindow) => [{
        label: `Summary ${this.state.msn}`,
        click: () => this.createSummary()
      },{
        label: `Library Compare ${this.state.msn}`,
        click: () => this.runLibCompare()
      },{
        label: `Visualize ${this.state.msn}`,
        click: () => dialog.showMessageBox({
            type: 'question',
            buttons: this.vizButtons,
            defaultId: 0,
            title: `Choose your visualization`,
            message: `Choose your visualization for ${this.state.msn}.`,
          }, res => this.visualize(res))
      }]
    });
  };

但是，当我右键单击另一个区域时，会弹出第一个上下文菜单，然后是第二个，一直弹出当前上下文菜单。

我基本上想在关闭上下文菜单后将其注销。我该怎么做？

更新：摆脱了上下文菜单并简单地将其提供给 handleContextMenu 功能：

  handleContextMenu = menuItems => {
    const menu = new electron.remote.Menu();
    menu.append(new electron.remote.MenuItem(menuItems));
    menu.popup(electron.remote.getCurrentWindow());
  }

而且有效！就是这样，也摆脱了电子上下文菜单。

Answer 1

这可以通过标准 Electron Menu API 实现，无需额外的模块，也许使用 electron-context-menu 只是让事情变得复杂，因为这似乎是为了简化标准上下文菜单的特定用例而设计的.使用标准菜单 API，您可以在每次单击时创建并弹出菜单，因此无需 "de-register" 菜单。

这是一个简化的示例，每次点击都会创建一个不同的新上下文菜单：

let menuCount = 1;
window.addEventListener('contextmenu', (e) => {
  e.preventDefault();
  let menu = new electron.remote.Menu();
  menu.append(new electron.remote.MenuItem({label : "Context Menu "+menuCount++}))
  menu.popup(electron.remote.getCurrentWindow());
});

在第一次右键单击时，您将看到一个包含项目 "Context Menu 1" 的菜单，在第二次右键单击时，您将看到一个包含 "Context Menu 2" 项的菜单，依此类推。

如何在电子中取消注册上下文菜单监听器

How to de-register context menu listerners in electron

contextmenu

event-handling

mouseevent

node.js

electron