在JavaScript中动态加载JSX文件_Javascript_Reactjs_React Jsx

在JavaScript中动态加载JSX文件

javascript reactjs

在JavaScript中动态加载JSX文件,javascript,reactjs,react-jsx,Javascript,Reactjs,React Jsx,我正在尝试为ReactJS组件实现一个包装器API文件例如，/js/test.react.js /** @jsx React.DOM */ var TESTCLASS = React.createClass({ render : function() { return ( <div> Test </div> ); } }); /**@jsx React.DOM*/ var TESTCLASS

我正在尝试为ReactJS组件实现一个包装器API文件

例如，/js/test.react.js

   /** @jsx React.DOM */
var TESTCLASS = React.createClass({
    render : function() {
        return (
            <div> Test </div>
        );
    }
});

/**@jsx React.DOM*/
var TESTCLASS=React.createClass({
render:function（）{
返回(
试验
);
}
});

我已经为此编写了一个包装器JavaScript文件：

var testClass = {
    load: function () {
        var script = document.createElement("script");
        script.type = "text/jsx";
        document.head.appendChild(script);
        script.onload = function(){
            React.render(
                <TESTCLASS/>,
                document.body)
        };
        script.src ="./js/test.react.js";
    }
};

var testClass={
加载：函数（）{
var script=document.createElement（“脚本”）；
script.type=“text/jsx”；
document.head.appendChild（脚本）；
script.onload=函数（）{
反应(
,
文件（正文）
};
script.src=“./js/test.react.js”；
}
};

然后我可以在第三方HTML中使用包装器API JavaScript

<html>
<head>
    <title>Hello React</title>
    <script src="http://fb.me/react-0.12.2.js"></script>
    <script src="http://fb.me/JSXTransformer-0.12.2.js"></script>
    <script src="http://code.jquery.com/jquery-1.10.0.min.js"></script>
    <script type="text/jsx" src="test.js"></script>
</head>
<body>

<div id="content"></div>
<script>
    testClass.load();
</script>

</body>
</html>


你好，反应
testClass.load（）；

然而，在我看来/js/test.react.js不能作为纯JavaScript文件动态加载。任何专家都可以向我解释原因并提供编写包装器API JavaScript文件的适当解决方案吗？

JSXTransformer*.js

导出一个全局

JSXTransformer

对象，该对象具有

exec（）

函数，该函数传输JSX，然后

eval（）

s结果

您可以先尝试运行脚本内容为onload的

JSXTransformer.exec（）

另外，仅供参考，从React 0.12开始：）

您每次都不能编译成jsx吗？grunt任务可以在每次代码更改时自动完成。JSXTTransformer已被弃用