как общаться между реакцией и электроном

Question

Создание настольного приложения с использованием реакции и электрона. Я хочу вызвать метод в main. js электрона из реагирующего компонента. В angular был пакет npm.

import React, { useState, useEffect, useRef } from 'react';
import './diagnosis.css';
const electron = window.require('electron');// if i use require('electron') throws error
function Diagnosis(props) {
    const [data, setData] = useState({ hits: [] });
    useEffect(() => {
        getExeFiles();
    });
    const getExeFiles = () => {
        electron.ipcRenderer.send('get-exe'); 
    }
    return(<></>)
}

main . js

electron.ipcMain.on('get-exe', () => {
    console.log('reaciovg');
    mainWindow.webContents.send('return-exe', '');
});

Как решить эту проблему?

Answer 1

У вашего Renderer. js

const { ipcRenderer } = require('electron');

async function runCommand(cmd) {
  const res = await ipcRenderer.sendSync('runCommand', cmd);
  return res;
}

У вас main. js

// Listen event through runCommand channel
// And return the result to Renderer.
ipcMain.on('runCommand', async (event, arg) => {
  event.returnValue = await runCommand(arg);
});

Это самый простой способ связи между процессом main и renderer.

Но я думаю, что вы собираетесь отправить результат из основного процесса в средство визуализации, используя mainWindow.webContents.send('return-exe', '');

Таким образом, это означает, что вы отправляете результат по каналу return-exe IP C из основного рендереру. И вы должны слушать событие с этого канала у вашего рендерера. Вот так

ipcRenderer.on('retrun-exe', (event, arg) => {
    ...
});

Вы можете добавить этого слушателя в свои функции жизненного цикла. Я использовал, чтобы добавить это к componentDidMount() Но в вашем случае, пожалуйста, добавьте это к вашему useEffect()