Electron 使用 Accelerator 在上下文菜单中调用菜单项答案

【问题标题】：Electron using Accelerator to call a menu item in context menuElectron 使用 Accelerator 在上下文菜单中调用菜单项
【发布时间】：2019-06-02 17:01:17
【问题描述】：

如何使用accelerator 在上下文菜单中调用menu item？

var menu = new Menu();

menu.append(new MenuItem({
  label: 'Say something',
  click: function(){
    alert("Hello");
  },
  accelerator: "CmdOrCtrl+E"
}));


window.addEventListener('contextmenu', function (e) {
  e.preventDefault();
  menu.popup(currentWindow);
}, false);

上面的代码有效。出现上下文菜单，当单击菜单项时，单击回调起作用。

但是加速器命令不起作用。有什么想法吗？

附加问题：

我可以将click event 传递给menu.popup，然后将其传递给menu-item click callback 吗？现在我只是将点击事件存储在一个全局变量中。

【问题讨论】：

标签： javascript contextmenu electron

【解决方案1】：

我不相信 Electron 会注册一个加速器，除非你调用 Menu.setApplicationMenu(menu) 或类似的。在您的 sn-p 中，您创建了一个菜单，但在您调用 popup 方法之前，您并没有真正对它做任何事情。在您注册之前，Electon 如何知道您想使用加速器？这些是在设置到应用程序菜单时注册的。

话虽如此，Electron 似乎并没有提供一种简单的方法来注册本地的、仅限渲染器进程的快捷方式，而无需创建 BrowserWindow 菜单。你可以在这个问题上阅读更多关于它的信息：https://github.com/atom/electron/issues/1334 OSX 版本。

建议的解决方案是在 JavaScript 中捕获您想要的快捷方式，然后以这种方式触发命令。您仍然可以使用加速键选项来表示上下文菜单中的组合键。

【讨论】：

【解决方案2】：

我发现今天注册上下文菜单加速器最简单的方法是将上下文菜单附加到您的应用程序菜单中，这将注册它们，但设置 visible: false 以便它们不会实际出现。

使用菜单模板非常简单。

function registerAppMenu(app, invisibleMenus) {
  const template = [ ... ]; // use app to create the file-menu
  template.push(...invisibleMenus.map(menu => ({...menu, visible: false})));
  Menu.setApplicationMenu(Menu.buildFromTemplate(template));
}

【讨论】：

【解决方案3】：

最好改用这个：

const {Menu} = require('electron').Menu;
const mainMenu = Menu.buildFromTemplate(mainMenuTemplate);
Menu.setApplicationMenu(mainMenu)

所以你可以使用

mainMenuTemplate.push({
    /* your menu item properties*/
});`

把它推到底。使用 unshift() 而不是 push() 来添加到 mainMenuTemplate 的开头，但是即使是加速器也会被添加并且可以正常工作。

【讨论】：