javascript - 如何从 renderer.js 调用 react 组件代码？-6ren

javascript - 如何从 renderer.js 调用 react 组件代码？

转载作者：行者123 更新时间：2023-12-03 12:36:49

嗨，我是 React/JS 和 Electron 的新手，想使用这些技术编写一个桌面应用程序。
我现在面临的问题是我不确定如何从 renderer.js 调用 react 组件代码。我有这样的编码结构。
Electron 教程

    src/
        components/Test.js
        application.js
        electron-starter.js
        mainWindow.html
    package.json

这是每个文件的代码片段列表。
包.json:

  "main": "src/electron-starter.js",

Electron 启动器.js

const application = require("./application");
global.application = new application();
global.application.run();

应用程序.js

odule.exports = class Application {
  createWindow() {
    this.mainWindow = new BrowserWindow({
      width: 1366,
      height: 768,
...
        pathname: path.join(__dirname, "./mainWindow.html"),

mainWindow.html

<body>
  <div id="test"></div>
  <script src="./renderer.js"></script>
</body>

所以我想从 mainWindow.html 调用 renderer.js。我了解到我知道我可以这样调用函数:
渲染器.js

"use strict";

const { shell } = require("electron");

function hoge() {
  console.log("hoge");
}

window.hoge();

但是我想做的是从renderer.js调用下面的react组件。
测试.js

import React from "react";

export class Test extends React.Component {
  render() {
    return <h1>Hello from Test class</h1>;
  }
}

请你帮助我好吗？谢谢阅读 !

最佳答案

当您刚刚开始时，我建议您使用像 Electron-React 这样的样板。 .

关于javascript - 如何从 renderer.js 调用 react 组件代码？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/66692671/

文章推荐： javascript - 无法用Electron写入文件

文章推荐： python-2.7 - 数据交换——Python 和 Fortran

文章推荐： highcharts - 我希望在 highcharts 中将空天显示为 0

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 如何从 renderer.js 调用 react 组件代码？