[[File:electron_menu_role.png|300px]]
====コンテキストメニュー====
----
*contextBridgeを利用する
[[File:electron_contextmenu.png|400px]]
*index.html
<pre>
function openContextMenu(e) {
e.preventDefault();
window.api.openContextMenu("hoge");
}
window.addEventListener('contextmenu', openContextMenu, false);
</pre>
*preload.js
<pre>
contextBridge.exposeInMainWorld(
"api",
{
openContextMenu: (type) => {
return ipcRenderer.invoke('open-context-menu', type);
}
}
);
</pre>
*main.js
<pre>
const { ipcMain, BrowserWindow, Menu } = require('electron');
ipcMain.handle('open-context-menu', (ev, msg) => {
var win = BrowserWindow.getFocusedWindow();
let contextmenuTemplate = [
{
label: msg, click(m ,w) {
alert(m + w);
}
},
{ type: 'separator' },
{ label: '切り取り', role: 'cut' },
{ label: 'コピー', role: 'copy' },
{ label: '貼り付け', role: 'paste' },
];
const contextMenu = Menu.buildFromTemplate(contextmenuTemplate);
contextMenu.popup({window : win});
});
</pre>
===Dialog===
----