Javascript 简单反应代码段不工作_Javascript_Reactjs

Javascript 简单反应代码段不工作

javascript reactjs

Javascript 简单反应代码段不工作,javascript,reactjs,Javascript,Reactjs,嗨，我是新来的，我正在尝试运行这个小片段，但它不起作用： var Hello=React.createClass（{ render:function（）{ 返回( 你好，世界！ ); } }); ReactDOM.render（，document.getElementById（“app_root”）；如果您不想使用JSX，Babel。。。您必须将JSX定义替换为React.createElement（Hello，null，null）我没有测试以下代码，但在我看来这应该是正确的：

嗨，我是新来的，我正在尝试运行这个小片段，但它不起作用：


var Hello=React.createClass（{
render:function（）{
返回(
你好，世界！
); 
} 
}); 
ReactDOM.render（，document.getElementById（“app_root”）；

如果您不想使用JSX，Babel。。。您必须将JSX定义

替换为

React.createElement（Hello，null，null）

我没有测试以下代码，但在我看来这应该是正确的：


var Hello=React.createClass（{
render:function（）{
返回React.createElement（'div'，null，'helloworld'）；
} 
}); 
ReactDOM.render（React.createElement（Hello，null，null），
document.getElementById（“app_root”）；

正如其他答案中提到的，这是因为JSX需要

巴别塔

。在您的情况下，只需包含

babel

，而不仅仅是

浏览器polyfill

：


var Hello=React.createClass（{
render:function（）{
返回(
你好，世界！
); 
} 
}); 
ReactDOM.render（，document.getElementById（“app_root”）；

Codepen版本工作正常：

这意味着你的问题是巴别塔脚本。我同意@bmceldowney-polyfill版本是不够的，只包括来自cdnjs的常规版本

此外，您还可以在不使用巴别塔的情况下编写简单的“Hello World”：

<html>
<head>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react/15.2.0/react.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/15.2.0/react-dom.min.js"></script>
</head>
<body>
  <div id="app_root"></div>
  <script>
    var element = React.createElement(
        'div',
        null,
        'Hello World'
    )

    ReactDOM.render(
      element,
      document.getElementById('app_root')
    );
  </script>
</body>
</html>


var element=React.createElement(
"div",，
无效的
“你好，世界”
)
ReactDOM.render(
元素，
document.getElementById（'app_root'））
);

尝试删除

type=“text/babel”