无法呈现：React.renderComponent 在我的流星应用程序中

Question

你好，我刚开始在 webstorm 中使用 react(jsx) 制作我的流星应用程序，但我似乎无法找出无论我搜索多少，我的 React 组件都无法呈现的原因。

我正在关注 this tutorial，这是我 html

中的脚本

<script type="text/jsx">
    /*** @jsx React.DOM */

    var APP = React.createClass({
        render:function(){
            return (
                <div>
                    <h1>this is a app</h1>
                </div>
                )
        }
    });

    React.renderComponent(<APP />, document.getElementById('content'))
</script>

但是当我运行流星应用程序时，我得到 this in the browser

更新：问题最终是我需要渲染我的组件我的流星文档（在 js 中）不在我的 html

的 jsx 部分

Answer 1

看起来它只是在抱怨 jsx 并且不喜欢这些标签。也许在没有 jsx 的情况下尝试 renderComponent 调用？

    React.renderComponent(React.createElement(APP, null), document.getElementById('content'))

否则，请尝试将所有 jsx（包括 class 定义）转换为原生 js：

var APP = React.createClass({displayName: "APP",
        render:function(){
            return (
                 React.createElement("div", null, 
                    React.createElement("h1", null, "this is a app")
                 )
                )
        }
    });

    React.renderComponent(React.createElement(APP, null), document.getElementById('content'))

您可以使用 Facebook 提供的便捷 jsx compiler

Answer 2

您可以尝试 react-meteor，它允许您使用 reactMeteor 创建组件 class，并将它们导出为 meteor blaze 模板，使其非常容易重新利用。

无法呈现：React.renderComponent 在我的流星应用程序中

Cannot render: React.renderComponent in my meteor app

meteor

reactjs

react-jsx