vue.js - 如何在 main.js 的不同文件中分离 ipcMain.on() 函数

Question

我正在创建一个以 vuejs 作为前端的 Electron 应用程序。如何在与 main.js 不同的文件中创建所有 ipcMain.on() 函数。我想要一个更干净的代码结构。

该应用程序必须脱机工作，因此我需要将数据存储在本地数据库中。所以当我在前端创建一个对象时，我将它和 ipcMain 一起发送到 Electron 端。然后 Electron 可以将其写入本地数据库。

我想要这样的东西:

主要.js:

import { app, protocol, BrowserWindow } from "electron";
import {
  createProtocol,
  installVueDevtools
} from "vue-cli-plugin-electron-builder/lib";

require("./ipcListeners.js");

ipcListeners.js:

import { ipcMain } from "electron";

ipcMain.on("asynchronous-message", (event, arg) => {
  console.log(arg);
  event.reply("asynchronous-reply", "pong");
});

ipcMain.on("random-message", (event, arg) => {
  console.log(arg);
  event.reply("random-reply", "random");
});

这里的问题是只有第一个 ipcMain.on() 函数有效，但第二个，...没有

Answer 1

我在我的项目中所做的是，我根据类别将所有 IPC 排列在不同文件夹中，在每个文件中，我导出所有 IPC，如下例所示
产品.js

module.exports = {
products: global.share.ipcMain.on('get-products', (event, key) => {
    getProducts()
        .then(products => {
            event.reply('get-products-response', products)
        })
        .catch(err => {
            console.log(err)
        })
})
}

然后我创建了一个新文件，该文件导入了所有导出的 IPC
索引.js

const {products} = require('./api/guestIpc/products')

module.exports = {
    products
}

最后我把这个文件导入到 main.js 文件中。
主文件

const { app, BrowserWindow, ipcMain } = require('electron')

global.share = {ipcMain} #this is only for limiting the number of ipcMain calls in all the IPC files

require('./ipc/index') #require the exported index.js file

就是这样，现在所有外部 IPC 都像在 main.js 文件中一样工作