时间戳

首页 > 解决方案 > 如何从远程切换到 ipcMain 和 ipcRenderer？

javascript - 如何从远程切换到 ipcMain 和 ipcRenderer？

问题描述

我正在制作带有反应的电子应用程序，并且我使用远程模块完成了标题栏控件，但在控制台中我收到警告说remote模块已被弃用。我想更改我的代码以使用ipcMain，ipcRenderer而不是远程，但我无法让它工作。

这是我的代码，它可以 100% atm 工作，但使用远程模块。有人可以展示至少一个功能，例如app.minimize()如何使用ipcMain和ipcRenderer？

import { useState, useEffect } from "react";
import { remote } from "electron";
import {
  VscChromeMinimize,
  VscChromeMaximize,
  VscChromeRestore,
  VscChromeClose,
} from "react-icons/vsc";

const TitlebarControls = ({ minimize, maximize, close }) => {
  const app = remote.getCurrentWindow();
  const [maximizeIcon, setMaximizeIcon] = useState(
    app.isMaximized() ? <VscChromeRestore /> : <VscChromeMaximize />
  );

  useEffect(() => {
    app.on("maximize", () => setMaximizeIcon(<VscChromeRestore />));
    app.on("unmaximize", () => setMaximizeIcon(<VscChromeMaximize />));
  }, [app]);

  return (
    <ul className="titlebar-controls">
      {minimize && (
        <li className="minimize" onClick={() => app.minimize()}>
          <VscChromeMinimize />
        </li>
      )}
      {maximize && (
        <li
          className="maximize"
          onClick={() =>
            !app.isMaximized() ? app.maximize() : app.unmaximize()
          }
        >
          {maximizeIcon}
        </li>
      )}
      {close && (
        <li className="close" onClick={() => app.close()}>
          <VscChromeClose />
        </li>
      )}
    </ul>
  );
};

export default TitlebarControls;

标签： javascriptreactjselectron

解决方案

该remote模块将在 Electron 14 中删除，但@electron/remote如果您只关心弃用，则可以使用模块。文档提供了以下使用方法：

// Deprecated way
// const { BrowserWindow } = require('electron').remote
// Replace with:
const { BrowserWindow } = require('@electron/remote')

// In the main process:
require('@electron/remote/main').initialize()

如果您希望 ipc 方法达到相同的效果，请执行以下操作：

在 renderer.js 中：

const { ipcRenderer } = require('electron')
//to minimize
ipcRenderer.send('minimize', data);//data contains any extra info you may need to send

在 main.js 中：

const { ipcMain, app } = require('electron')
ipcMain.on('minimize', (event, data) => {
    //Minimize logic
})

推荐阅读