主要流程（单独）

Question

我希望创建一个对话框（模态窗口），当用户单击应用程序菜单上的“关于”链接时，该对话框将显示。我正在考虑这些问题：

let menuTemplate = {
  menu: [
    {
      label: 'About',
      click () {
        let about = document.querySelector('.hidden');
        about.classList.remove('hidden');
      }
    }
  ]
}

const menu = Menu.buildFromTemplate(menuTemplate)
Menu.setApplicationMenu(menu)

我得到的消息是'文档未定义'我相信这是因为电子应用程序的菜单位于主进程中，而页面的DOM处于渲染器进程中。

我知道主进程和远程进程之间有一种通信方式，但这对我来说真的很混乱。有人能告诉我接下来的步骤是什么吗？

ps我正在使用NodeJS和Express with Electron

Answer 1

现在有两种方法可以考虑这个：一个可以在主进程中完成，另一个需要跨进程消息传递。

主要流程（单独）

使用主进程，我们可以在require语句中导入dialog类，然后使用该方法（如Arun在另一个答案中所建议的那样）：

dialog.showMessageBox([browserWindow, ]options[, callback])

这将显示操作系统本机的对话框。你甚至可能会发现你想在渲染器过程中使用它来做一些事情，但接下来我会接下来。

进程间通信

您的托盘菜单已在主进程中实例化，但事件的结果必须在渲染器进程中显示以显示您的模态。

在主要流程中，我们可以导入ipcMain，在渲染器流程中，您猜对了，ipcRenderer。

在点击事件中，您可以使用BrowserWindow#webContents#send方法向渲染中发送一个事件，我们称之为'ShowMyModal'：

myWindowInstance.webContents.send('ShowMyModal');

现在，在主要流程中，我们可以使用ipcMain对象监听此事件。

ipcMain.on('ShowMyModal', function () {
  // the modal event has fired!

  $('#myModal').show();
});

您可能会发现此类内容的进程间通信。习惯于来回抛出IPC事件，它真实地展示了电子的美感及其渲染过程。

Answer 2

您可以使用电子对话框轻松创建对话框/弹出窗口。

dialog.showMessageBox([browserWindow, ]options[, callback])

请查看此文档了解更多信息： https://electron.atom.io/docs/api/dialog/

使用菜单项

2 个答案:

主要流程（单独）

进程间通信