React.render(）未渲染组件

React.render() not rendering component

本文关键字：组件 render React      更新时间：2023-09-26

我正试图了解React、Reflux和JSX。我有一个简单的文件，我想试着开始工作。

<html>
    <body>
        <div id="counter"></div>
        <script src="bower_components/react/react.js"></script>
        <script src="bower_components/reflux/dist/reflux.js"></script>
        <script src="bower_components/react-dom/react-dom.js"></script>
        <script type="text/jsx">
            var CounterComponent = React.createClass({
                render: function() {
                    return (
                        <div>Hello, world</div>
                    );
                }
            });
            React.render(<CounterComponent />, document.getElementById("counter"));
        </script>
    </body>
</html>

我已经设置了我的操作、存储和组件。但是React.render()实际上并没有在我的div中创建任何东西。我已经注释掉了大部分代码，试图找出它没有呈现的原因。我没有错误，所以我认为这与jsx没有被看到有关。。。

有什么想法为什么这没能呈现出我的"你好世界"吗？

JSX Transformer在Babel中可用。通过安装带有bower的babel，添加以下内容，实现了这一点：

<script src="bower_components/babel/browser.js"></script>

将"text/jsx"更改为"text/babel"

在此之后，组件正确渲染。

相关文章：