• 2023最新electron 进程间通讯的几种方法


    数据传递(旧)

    渲染进程发数据到主进程

    1. // 按钮事件
    2. const handleWebRootPathClick = () => {
    3. ipcRenderer.send('open_dir')
    4. }
    5. // main.ts中接收
    6. ipcMain.on('open_dir', () => {
    7. console.log('recv ok')
    8. })

    主进程发数据到渲染进程

    1. // main.ts中发送数据
    2. win.webContents.send('load', {message: "主进程执行了,这是结果"});
    3. // 组件中接收
    4. ipcRenderer.on('load', (_, message) => {
    5. console.log('主线程过来的数据:', message)
    6. })

    数据传递(新)

    渲染进程到主进程

    1. // preload.js
    2. const menuOpt = {
    3. min: () => ipcRenderer.send('window:minimize'),
    4. isMaximized: () => ipcRenderer.invoke('get:isMaximized'),
    5. maximize: () => ipcRenderer.send('window:maximize'),
    6. restore: () => ipcRenderer.send('window:restore'),
    7. close: () => ipcRenderer.send('window:close')
    8. }
    9. contextBridge.exposeInMainWorld('electronAPI', {
    10. menuOpt,
    11. })
    12. // 渲染进程
    13. const { menuOpt } = window.electronAPI
    14. menuOpt.min()
    15. // 主进程
    16. const renderFuncInit = () => {
    17. ipcMain.on('window:minimize', () => {
    18. win.minimize()
    19. win.webContents.send('update-counter', '6666')
    20. })
    21. ipcMain.on('window:maximize', () => {
    22. win.maximize()
    23. })
    24. ipcMain.on('window:restore', () => {
    25. win.restore()
    26. })
    27. ipcMain.on('window:close', () => {
    28. win.close()
    29. })
    30. ipcMain.handle('get:isMaximized', async () => {
    31. return win.isMaximized()
    32. })
    33. }
    34. // 初始化app(在 Electron 完成初始化时触发),挂载上面创建的 桌面应用程序窗口
    35. app.whenReady().then(() => {
    36. renderFuncInit()
    37. createWindow()
    38. })

    主进程到渲染进程

    1. // preload.js
    2. contextBridge.exposeInMainWorld('electronAPI', {
    3. handleCounter: (callback) => ipcRenderer.on('update-counter', callback)
    4. })
    5. // 主进程
    6. win.webContents.send('update-counter', '6666')
    7. // 渲染进程
    8. const { menuOpt, handleCounter } = window.electronAPI
    9. handleCounter((_event, value) => {
    10. console.log(value, _event)
    11. })

    双向通讯

    1. // preload.js
    2. const file = {
    3. openDir: (dirPath) => ipcRenderer.invoke('file:openDir', dirPath),
    4. }
    5. contextBridge.exposeInMainWorld('electronAPI', {
    6. file,
    7. })
    8. // 主进程
    9. ipcMain.handle('file:openDir', async (_, dirPath = __dirname) => {
    10. const { canceled, filePaths } = await dialog.showOpenDialog({
    11. defaultPath: dirPath, // 默认盘
    12. properties: ['openFile', 'openDirectory']
    13. })
    14. return {
    15. isCanceled: canceled,
    16. files: filePaths
    17. }
    18. })
    19. // 渲染进程
    20. const openDir = async () => {
    21. const { isCanceled, files } = await file.openDir()
    22. console.log('dddd', isCanceled, files)
    23. }
  • 相关阅读:
    串口通信问题排查总结
    docker 构建docker-compose
    Ceph入门到精通-Nginx超时参数分析设置
    2022年9月2日:面向初学者的 web 开发--使用 JavaScript 制定决策
    QT应用启动失败排查方法
    我帮厂商找BUG系列之华大(小华)HC32F460——PWM输出占空比错误与解决方案
    win32&mfc————win32消息机制
    【普通人题解】LeetCode 三数之和
    Flink 1.11+ 版本如何生成 Watermark
    大数据开发之Sqoop详细介绍
  • 原文地址:https://blog.csdn.net/h1530687053/article/details/134333841