Javascript 如何在捆绑包中发送值

我正在从事ReactJs项目，我们不使用任何API来管理数据

在项目中，我们使用Webpack捆绑React应用程序

现在的问题是React应用程序应该可以在任何网站上使用，包括bundle.js，网站将允许提供一些输入数据，因此我们将加载React应用程序

因此，我正在寻找将数据发送到捆绑的ReactAPP的最佳方法，以便我们可以根据提供的数据编写加载React的逻辑

注意：没有机会使用API调用，因为ReactAPP通过包含bundle.js独立于任何网站使用

在PHP网站中

index.php

const configReactApp={
“选择器”：“loadmy\u react\u here”，//应该ID
“配置”：{}
};

反应

ReactDOM.render（，document.getElementById（configReactApp.selector）
);

在ReactJS文件src/index.js中

import React from 'react';
import ReactDOM from 'react-dom';

window.MyReactApp = {
    init: (selector, myData) => {
        selector = selector.substring(1);
        const renderComponent = (<homeComponent mydata={myData} />);
        ReactDOM.render(renderComponent, document.getElementById(selector));
    },
};

从“React”导入React；
从“react dom”导入react dom；
window.MyReactApp={
初始化：（选择器，myData）=>{
选择器=选择器。子字符串（1）；
常量renderComponent=（）；
render（renderComponent，document.getElementById（选择器））；
},
};

现在将ReactJs应用程序加载到要加载的位置

<script type="text/javascript" src="bundle.min.js"></script>
<div id="load-myreactapp"></div>

<script type="text/javascript">
    const myData = {};
    MyReactApp.init('#load-myreactapp', myData);
</script>

常量myData={}；
MyReactApp.init（“#加载MyReactApp”，myData）；

在

窗口设置一个值应该足够了。您有什么问题？看起来您已经在尝试使用全局配置变量…很棒的解决方案事件允许我们根据不同的需要加载React应用程序。
import React from 'react';
import ReactDOM from 'react-dom';

window.MyReactApp = {
    init: (selector, myData) => {
        selector = selector.substring(1);
        const renderComponent = (<homeComponent mydata={myData} />);
        ReactDOM.render(renderComponent, document.getElementById(selector));
    },
};

<script type="text/javascript" src="bundle.min.js"></script>
<div id="load-myreactapp"></div>

<script type="text/javascript">
    const myData = {};
    MyReactApp.init('#load-myreactapp', myData);
</script>