2015-12-09 13 views
5

Ben commentBox.jsx dosyası var (metin/babel) sınıfı tanımlanmadı tepki:aşağıdaki kodla

<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, ben bu bileşeni işlemek istiyorum Ama hata alıyorum: "CommentBox tanımlı değil"; Neden bu çalışmıyor? Tüm kodu bir dosyaya (commentBox.js) yerleştirirsem - işe yarayacak.

cevap

3

diğer ikisi yukarıda kendi komut dosyası bloğunda var CommentBox; ilan etmek gerekir. Değişkenlerinizin kapsamı, komut dosyası içe aktarmalarınız arasında paylaşılmaz.

<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>

Ayrıca jsx dosyadan var kaldırabilirsiniz.

+0

Bu benim için çalıştı.

0

CommentBox bildirilmedi. Eğer bu şekilde isterseniz, o zaman kodları böyle gitmeli:

<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> 
+0

Bu kodda ReactDom nesnesi hakkında neler söyleyebilirsiniz? Bildirilmiyor mu? –

+0

ReactDom, bileşenin DOM'a dönüştürülmesi için kullanılan kütüphanedir ve koda içe aktarılmalıdır ancak CommentBox gibi bileşen de tanımlanmamıştır. – vistajess

+0

Yanlış cevap))) CommentBox ReactDOM.render çağrısından önce ekledim. Pencerenin nesnesinin küresel kapsamı –

İlgili konular