は、次のコードで

私は、commentBox.jsxファイルを持っている（テキスト/バベル）クラスが定義されていませんリアクト：は、次のコードで

<div id="content"></div> 
<script type="text/babel" src="scripts/commentBox.jsx"></script> 

<script type="text/babel"> 
    ReactDOM.render(<CommentBox />, document.getElementById('content')); 
</script>

：

var CommentBox = React.createClass({ 
    render: function() { 
    return (
     <div className="commentBox"> 
     <h1>Comments</h1> 
     </div> 
    ); 
    } 
});

はindex.htmlをで、私は、このコンポーネントをレンダリングしたいですしかし、私はエラーが出ます： "CommentBoxは定義されていません";なぜこれは動作していないのですか？私は1つのファイル（commentBox.js）内のすべてのコードを配置する場合は - それは動作します。

出典

2015-12-09 Andrey Mykhaylov

あなたは他の2以上の独自のスクリプトブロックでvar CommentBox;を宣言する必要があります。変数のスコープは、スクリプトのインポート間では共有されません。

<div id="content"></div> 
 
<script> 
 
    var CommentBox; 
 
</script> 
 
<script type="text/babel" src="scripts/commentBox.jsx"></script> 
 
<script type="text/babel"> 
 
    ReactDOM.render(<CommentBox />, document.getElementById('content')); 
 
</script>

また、あなたのjsxファイルからvarを削除することができます。

出典

2016-01-03 23:27:14 mitchfuku

これは私のために働いた。 '' '

CommentBoxは宣言されていません。あなたはそれそのようにしたい場合は、あなたのコードは次のように行く必要があります。

<script type="text/babel"> 
var CommentBox = React.createClass({ 
    render: function() { 
    return (
    <div className="commentBox"> 
      <h1>Comments</h1> 
    </div> 
    ); 
    } 
}); 

ReactDOM.render(<CommentBox />, document.getElementById('content')); 

</script>

出典

2015-12-09 11:31:07 vistajess

ReactDomオブジェクトについて、このコードではどう思いますか？それは宣言されていないのですか？ –

ReactDomはDOMにコンポーネントをレンダリングするために使用されるライブラリであり、コードにインポートされなければならないが、このようなCommentBoxなどの成分自体も定義されていません。 – vistajess

それは私がReactDOM.renderの呼び出しの前に追加））CommentBox間違った答えです。それはあなたが今、正しい答えを持っていますウィンドウオブジェクト –

答えて

関連する問題