Electron 如何在 mainWindow 断开外部连接时加载主菜单 HTML

Electron how to load Main Menu when mainWindow is severing external HTML

在 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);
});

自定义-menu.js:

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

  return template;
}

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