React.renderComponent不是函数

Question

React.renderComponent不是函数

gst*_*low 5 javascript node.js reactjs babeljs react-dom

我已经为初学者阅读了一些关于ReactJs的文章.我读过的文章只显示了代码片段.我的第一个组件出现问题:

完整代码:

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react-dom.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser.js"></script>
    <meta charset="UTF-8">
    <title>HELLO WORLD</title>
</head>
<body>
<div id="content"></div>


<script type="text/babel">
    var HelloWorld = React.createClass({
        render: function () {
            return React.DOM.h1("hello world!!");
        }
    });

    React.renderComponent(
        HelloWorld,
        document.getElementById("content")
    );
</script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

当我打开页面时,我看到了 embedded:11 Uncaught TypeError: React.renderComponent is not a function

有谁能指出我正确的方向？

我也试过这个没有运气:

<!DOCTYPE html>
<html lang="en">
<head>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react.js"></script>
<!--    <script src="https://cdnjs.cloudflare.com/ajax/libs/react/0.14.0/react-dom.js"></script>
    <script src="https://cdnjs.cloudflare.com/ajax/libs/babel-core/5.6.15/browser.js"></script>-->
    <meta charset="UTF-8">
    <title>HELLO WORLD</title>
</head>
<body>
<div id="content"></div>


<script type="text/babel">
    var HelloWorld = React.createClass({
        render: function() {
            return React.createElement("h1", null, "Hello world!!");
        }
    });

    ReactDOM.render(React.createElement(HelloWorld, null), document.getElementById("content"));
</script>
</body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

小智 1

编辑：我看到你使用了babel-core browser.js，它已被弃用，删除它并直接使用 React 。

删除script类型并将所有内容替换为：

var HelloWorld = React.createClass({
  render: function() {
    return React.createElement("h1", null, "Hello world!!");
  }
});

ReactDOM.render(React.createElement(HelloWorld, null), document.getElementById("content"));

Run Code Online (Sandbox Code Playgroud)

jsbin演示

归档时间：	8 年，12 月前
查看次数：	3264 次
最近记录：	8 年，9 月前