#Is there a way to open a react Component(JSX) as another electron window in the electron app?

5 messages · Page 1 of 1 (latest)

meager edge
#

hi, I have a question.

// Component1.jsx

  const handleOpenImageModal = () => {
      console.log("check"); // visible
      ipcRenderer.send("open-my-component",);
   };


 return (
<ExpandArrowsAltIcon
            title={t("Image Inspection")}
            size={18}
            role="button"
            onClick={handleOpenImageModal}
          />
          <Modal>
           <MyComponent />
          </Modal>
)


// electron.js

function initApp() {
  ipcMain.on("openImageModal", (event, res) => {
    console.log("event", event);
    console.log("res", res);

    let myWindow = new BrowserWindow({ width: 600, height: 400 });
    console.log("myWindow: ", myWindow);
    myWindow.loadFile("MyComponent.jsx");
  });
}

In ExpandArrowsAltIcon, the handleOpenImageModal function is executed after the onClick event is called, and the ipcRender.send() function is called after the

I want to make sure that another electron window is created inside the electron.js file.

Currently, In the newly opened window, I don't see anything. The component named MyComponent is the component for which the JSX is written.

As mentioned above, the code I wrote should render in the newly opened window.

OeRUo.png
#

I tried to

myWindow.loadFile(<MyComponent />);

myWindow.loadFile('/path/to/MyComponent');

but, still not working..

The loadFile function only seems to accept html files, is there any way to put in a JSX file?

smoky heart
#

No way

#

Same rules as for browser

meager edge
#

thanks