一个网站有多少g,icp备案管理系统,宝塔网站做301重定向,查备案怎么查询electron主进程与渲染进程直接的通信示例
1. 背景#xff1a;
electronvue实现桌面应用开发
2.异步模式
2.1使用.send 和.on的方式
preload.js中代码示例#xff1a; const { contextBridge, ipcRenderer} require(electron);// 暴露通信接口
contextBridge.exposeInMa…electron主进程与渲染进程直接的通信示例
1. 背景
electronvue实现桌面应用开发
2.异步模式
2.1使用.send 和.on的方式
preload.js中代码示例 const { contextBridge, ipcRenderer} require(electron);// 暴露通信接口
contextBridge.exposeInMainWorld(electron, {// 渲染进程向主进程通信sendAppDataPath: function(){ipcRenderer.send(sendappdatapath)},// 主进程向渲染进程通信onAppDataPath: (callback) ipcRenderer.on(appdatapath, (event, variable) callback(variable)),// 使用请求、响应模式【也是异步模式】上面的on,send同为异步模式gainAppDataPath: async () {return await ipcRenderer.invoke(gainappdatapath);},// 同步模式syncAppDataPath: () ipcRenderer.sendSync(syncappdatapath),});
main.js【主进程】
// 获取appdata路径并返回给vue
ipcMain.on(sendappdatapath, function(event){// 方法1返回变量给vueevent.reply(appdatapath, appDataPath); // 可发送成功接收需在vue mounted中接收// 方法2使用.send 发送// event.sender.send(appdatapath, appDataPath); // 可发送成功接收也需要再 vue mounted中接收
})vue.js【渲染进程】
// 发送部分代码
methods: {demo: function(){window.electron.sendAppDataPath(); // 调用发送接口},
}
// 需要在vue中的mounted中监听
mounted() {// 监听主进程的变量// 接收send、on的appdata变量window.electron.onAppDataPath((variable) {console.log(接受到变量: variable)})},2.2 使用.invoke的方式
preload.js中代码示例 const { contextBridge, ipcRenderer} require(electron);// 暴露通信接口
contextBridge.exposeInMainWorld(electron, {// 使用请求、响应模式【异步】gainAppDataPath: async () {return await ipcRenderer.invoke(gainappdatapath);},// 同步模式syncAppDataPath: () ipcRenderer.sendSync(syncappdatapath),});
main.js【主进程】
// 响应模式返回给vue
ipcMain.handle(gainappdatapath, () {console.log(invoke back varable);return appDataPath;
})vue.js【渲染进程】
// 在vue中的methods中
methods: {// 获取电脑apdata目录async gainAppDataPath() {// invoke响应模式 【异步】let appdatapath await window.electron.gainAppDataPath();console.log(目录为: appdatapath)},
}3. 同步模式
3.1 使用.sendSync
preload.js中代码示例 const { contextBridge, ipcRenderer} require(electron);// 暴露通信接口
contextBridge.exposeInMainWorld(electron, {// 同步模式syncAppDataPath: () ipcRenderer.sendSync(syncappdatapath),
});
main.js【主进程】
// 同步模式
ipcMain.on(syncappdatapath, (event) {event.returnValue xxx;
})vue.js【渲染进程】
// 发送部分代码
methods: {demo: function(){let syncappdatapath window.electron.syncAppDataPath();console.log(同步模式目录为: JSON.stringify(syncappdatapath))},
}
