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()
。
在 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()
。