Electron Ipc render emit event to Vuex

Question

Hi guys I'm building an app with multiple windows,

My App is developed in Vue + Electron

The main feature I'm trying to accomplish is when the user for example wants to do some action in electron open popup for example, and next I want to send action to Vuex store to display message to user

So How can I call Vuex action from electron?

Code Sample:

Vue component:

import { remote, ipcRenderer } from 'electron';

ipcRenderer.send('openPopup', id);

Electron Code:

import { ipcMain, app } from 'electron';


ipcMain.on('openPopup', (event, args) => {
    console.log('do some action');
    // now how can I call vuex action from here
});

I tried calling it with:

this.$store

but its undefined

JTInfinite JTInfinite · Accepted Answer · 2020-12-23T15:41:25

You could simply return the desired data back to the renderer process in the ipcMain.on event.

I would also recommend using ipcRenderer.invoke / ipcMain.handle (Electron Doc - ipcMain)

// Main process
ipcMain.handle('openPopup', async (event, ...args) => {
  const result = await somePromise(...args)
  return result
})

// Renderer process
async () => {
  const result = await ipcRenderer.invoke('open-popup', id)
  // this.$store.dispatch(....) etc etc
}

Electron Ipc render emit event to Vuex

1 Answers