javascript - 当 mainWindow 断开外部 HTML 时，Electron 如何加载主菜单

Question

在 Electron 中，我已经阅读了如何将菜单代码通常包含在index.html中。但在我的应用程序中，我正在加载一个外部网站，并且想知道如何执行此操作。

'use strict';

var electron = require('electron');
var app = electron.app;
var BrowserWindow = require('browser-window');

app.on('ready', function () {

  var mainWindow = new BrowserWindow ({
    width: 800,
    height: 600,
    webPreferences: {
      webSecurity: false
    }
  });

  mainWindow.loadURL('https://example.com/');
  mainWindow.webContents.openDevTools();

});

我无法控制 mysite.net 上提供的内容，因此在这种情况下如何以正确的方式制作自定义菜单!我想我可以在 app.js 中完成它，但很好奇这是否合适？

更新

如果有人好奇的话，这是我的具体处理方式:

'use strict';

var electron = require('electron');
var app = electron.app;
var BrowserWindow = require('browser-window');

var Menu = require('menu');
var customMenu = require('./libs/custom-menu');

app.on('ready', function () {

  var mainWindow = new BrowserWindow ({
    width: 800,
    height: 600
  });

  mainWindow.loadURL('https://www.example.com');

  var template = customMenu.getTemplate();
  var menu = Menu.buildFromTemplate(template);
  Menu.setApplicationMenu(menu);
});

自定义菜单.js:

exports.getTemplate = function () {
  var template = [
    {
      label: 'MyApp',
      submenu: [
        {
          label: 'Sub Navigation',
          click: function () {
            console.log('test');
          }
        }
      ]
    }
  ];

  return template;
}

Answer 1

您只需使用 Menu主进程中的模块。实际上，Menu 无论如何都是主流程模块的一部分，所以我想说这确实是使用它的“正确”方式。文档中的示例通过remote调用它来演示通过渲染器设置菜单的可能性；但您可以直接从主进程调用 Menu.setApplicationMenu() 。