コードを実行しているときにブランクの画面が表示される

私が現在使っているコードは単純なhello worldです。コードを実行しているときにブランクの画面が表示される

<!DOCTYPE html> 
<html> 
<head> 
    <!-- The core React library --> 
    <script src="http://localhost/react/react.js"></script> 
    <!-- The ReactDOM Library --> 
    <script src="http://localhost/react/react-dom.js"></script> 
    <meta charset="utf-8"> 
    <title>test</title> 
</head> 
<body> 
    <div id="content"></div> 
    <script type="text/jsx"> 
     var NewComponent = React.createClass({ 
      render : function(){ 
       return (
        <h2>My Name is React</h2> 
       ); 
      } 

     }); 
     React.render(<NewComponent/>,document.getElementById('content')); 
    </script> 
</body> 
</html>

コードを実行すると、空白の画面が表示されますが、コンソールにエラーはありません。代わりに、これらの参照を使用して、ローカルホストの参照を使用しての

出典

2016-12-22 Krishna Kumar

'ReactDom.render'は' React.render' – Kafo

はまだuは反応するのlibにlocalhostを使用してrはどのようReactDom.render –

を使用した後に得ていないいません？ ' 'と反応してdom参照を反応させます。 –

、それは動作します：

<script src="https://unpkg.com/[email protected]/dist/react.js"></script> 
<script src="https://unpkg.com/[email protected]/dist/react-dom.js"></script>

チェックこのHello Worldの例を：https://jsfiddle.net/reactjs/69z2wepo/

出典

2016-12-22 07:23:59

が

まず、あなたのコード内の2つの変更を行います。をreact v0.13 React.renderの後は、ReactDOM.renderを使用する必要があります。

第2：スクリプトソースを指定するときは、コードを含むindex.htmlファイルを相対的に指定する必要があります。

<!DOCTYPE html> 
<html> 
<head> 
    <!-- The core React library --> 
    <script src="./relative/path/to/react/react.js"></script> 
    <!-- The ReactDOM Library --> 
    <script src="./relative/path/to/react/react-dom.js"></script> 
    <meta charset="utf-8"> 
    <title>test</title> 
</head> 
<body> 
    <div id="content"></div> 
    <script type="text/jsx"> 
     var NewComponent = React.createClass({ 
      render : function(){ 
       return (
        <h2>My Name is React</h2> 
       ); 
      } 

     }); 
     ReactDOM.render(<NewComponent/>,document.getElementById('content')); 
    </script> 
</body> 
</html>

出典

2016-12-22 08:36:32

コードを実行しているときにブランクの画面が表示される

答えて

関連する問題