electron实现窗口之间的通信

目标:在使用electron-vue开发桌面端应用时,新建了一个窗口,希望主窗口的值能够在新窗口中进行使用,即涉及到了窗口之间的值的传递。

实现

  1. 窗口A的渲染进程发消息给主进程
const sendMsgMain = (msg) => {
    ipcRenderer.send('sendMsgMain', msg)
}
  1. 主进程收到消息后,再发消息给窗口B的渲染进程
ipcMain.on('sendMsgMain', (e, msg) => {
	childWin.webContents.send('msgFromMain', msg)  // childWin为B窗口
})
  1. 窗口B渲染进程接收主进程消息
const getMsgChild = () => {
    ipcRenderer.on('msgFromMain', (e, message) => {
        console.log(message)
    });
}
  1. 窗口B加载的组件中执行getMsgChild进行监听,窗口A加载的组件中创建按钮点击事件,触发sendMsgMain即可。
要让两个 Electron 应用程序之间进行通信,可以使用 Electron 的 inter-process communication (IPC) 功能。IPC 是一种在主进程和渲染进程之间进行通信的机制,可以让两个应用程序之间进行双向通信。 首先,需要在每个应用程序中引入 Electron 的 ipcMain 和 ipcRenderer 模块。ipcMain 模块用于主进程,而 ipcRenderer 模块用于渲染进程。 然后,可以使用 ipcMain 和 ipcRenderer 模块中的 send 和 on 方法来发送和接收消息。send 方法用于发送消息,而 on 方法用于监听接收到的消息。 以下是一个简单的例子,展示了如何在两个 Electron 应用程序之间进行通信: 主进程代码: ```javascript const { app, ipcMain } = require('electron'); const mainWindow = // 获取主窗口 ipcMain.on('message', (event, arg) => { console.log(arg); // 打印接收到的消息 event.sender.send('reply', 'Hello from main process!'); // 发送回复消息 }); ``` 渲染进程代码: ```javascript const { ipcRenderer } = require('electron'); ipcRenderer.send('message', 'Hello from renderer process!'); // 发送消息 ipcRenderer.on('reply', (event, arg) => { console.log(arg); // 打印接收到的回复消息 }); ``` 在这个例子中,主进程监听了名为 "message" 的事件,并在接收到事件时打印消息,然后发送一个名为 "reply" 的回复消息。渲染进程发送了一个名为 "message" 的消息,然后监听名为 "reply" 的事件来接收回复消息,并在接收到回复消息时打印出来。 需要注意的是,两个应用程序必须在同一台计算机上运行,并且需要使用相同的 Electron 版本。另外,建议使用唯一的标识符来标识不同的应用程序,以避免与其他应用程序的通信混淆。
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值