Javascript 使用requirejs加载具有父/子关系的React组件

我正在使用React/Flux开发一个高度可插拔的UI，并使用RequireJS加载模块

我无法回避这个问题，可能是因为我对RequireJS的了解不够。还有另一层间接性，但问题的根源在于：

我在具有以下渲染功能的模块中使用了React组件A：

render: function() {

<div>
    <Component B />
</div>
}

这非常有效，直到我尝试在ComponentA的渲染函数中使用ComponentB…ComponentA自然不知道ComponentB是什么，但我不确定正确的方法，或者在ComponentA尝试渲染之前如何要求ComponentB

注意：我正在预先将所有JSX转换为普通JS，所以这不应该是一个因素

---

有什么提示吗？

听起来你的模块不是定义-

使用定义，ComponentA完全可以获得对ComponentB的引用，最简单的示例如下：

require(['ComponentA'], function(ComponentA) {
    React.render(React.createElement(ComponentA,document.getElementById('main'));

});

组件A-具有依赖项-

define（['path/to/ComponentB']，函数（ComponentB）{
返回React.createClass（{
渲染：函数（）{
}
});
});

组件B-无依赖项-

define（函数（）{
返回React.createClass（{
渲染：函数（）{
一些文本
}
});
});

然后，您可以在问题中提到的顶级中呈现ComponentA，ComponentA将包含ComponentB

require(['ComponentA'], function(ComponentA) {
    React.render(React.createElement(ComponentA,document.getElementById('main'));

});

define(['path/to/ComponentB'], function (ComponentB) {
    return React.createClass( {
        render: function () {
            <div>
                <ComponentB />
            </div>
        }
    });
});

define(function () {
    return React.createClass( {
        render: function () {
            <div>
                Some Text
            </div>
        }
    });
});