如何在其他ipc渲染文件中使用 Electron.js 的 webContents.send 函数？

Question

我试图将 IPC 函数与电子中的 main.js 文件分开，因为它太长了，

我如何在不同的 js 文件而不是 main.js 中使用此 webContents.send

 mainWindow.webContents.send("search",recordset.recordset)

它显示此错误 无法读取未定义的属性（读取“webContents”）

Answer 1

关注点分离将是您的首要任务。为此，您可以使用 setters 和 getters。

请记住，当 Node 首先 require 的模块时，它也会被缓存。让我们利用这一优势作为状态管理的一种形式。

---

在分离/重构代码之前，您会发现您的 main.js 文件可能会增长到巨大的大小。使用诸如此类的技术将允许您将代码分割成易于管理、可读、单一职责的代码段。

如果您还没有这样做，那么让我们将 mainWindow 的构造从 main.js 文件移到它自己的文件中。

main.js（主线程）

// Import the necessary Electron modules.
const electronApp = require('electron').app;
const electronBrowserWindow = require('electron').BrowserWindow;

// Import the necessary Node modules.
const nodePath = require('path');

// Import the necessary Application modules.
const appMainWindow = require(nodePath.join(__dirname, 'main-window'));

// Prevent garbage collection.
let mainWindow = null;

// Application is now ready to start.
electronApp.on('ready', () => {
    mainWindow = appMainWindow.create();
});

// Re-activate Application when in macOS dock.
electronApp.on('activate', () => {
    if (electronBrowserWindow.getAllWindows().length === 0) {
        appMainWindow.create(mainWindow);
    }
});

// Close Application completely if not on macOS.
electronApp.on('window-all-closed', () => {
    if (process.platform !== 'darwin') {
        electronApp.quit();
    }
});

---

在自己的文件中管理 mainWindow 对象可以将我们的代码分成更具可读性和可管理性的块。

main-window.js （主线程）

// Import the necessary Electron modules.
const electronBrowserWindow = require('electron').BrowserWindow;

// Define the main window.
let mainWindow;

// Create the main window.
function create() {
    mainWindow = new electronBrowserWindow({
        x: 0,
        y: 0,
        width: 800,
        height: 600,
        show: false,
        webPreferences: {
            nodeIntegration: false,
            contextIsolation: true,
            preload: nodePath.join(__dirname, 'preload.js')
        }
    });

    // Load the main window.
    mainWindow.loadFile(nodePath.join(__dirname, 'main-window.html'))
        .then(() => { mainWindow.show(); })
        
    return mainWindow;
}

// Get the main window object.
function get() {
    return mainWindow;
}

// Export the publicly available functions.
module.exports = {create, get};

---

最后，在需要引用 mainWindow 对象的文件（或任何其他文件）中，只需 require 您的 main-window.js 文件并调用 get() 函数。

任意文件（主线程）

// Import the necessary Node modules.
const nodePath = require('path');

// Import the necessary Application modules.
const appMainWindow = require(nodePath.join(__dirname, 'main-window'));

// Lets use it.
appMainWindow.get().webContents.send("search", recordset.recordset);