2015-11-15 11 views
7

React için yeniyim ve tepki-yönlendirici (v1.0.0) ile hız almaya çalışıyorum.tepki-yönlendirici: 'Değişken İhlali: Geçersiz etiket: {HelloWorld}', bileşen tam orada iken

Basit bir bileşen ve basit bir yol kurdum, ancak bana bir hata veriyor: Invariant Violation: Invalid tag: {HelloWorld}. Açık bir hata olduğunu düşünürdünüz, ancak kodda neyin yanlış olduğunu anlayamıyorum.

Burada:

var HelloWorld = React.createClass({ 
    render: function() { 
     return (
      <p>Hello world</p> 
     ); 
    } 
}); 

var routes = (
    <Router> 
     <Route path="/" component="{HelloWorld}"/> 
    </Router> 
); 

ReactDom.render(routes, document.querySelector('#main')); 

ben ReactDom.render açıklamada <HelloWorld /> ile routes dışarı geçerseniz, iyi çalışıyor.

Herhangi bir yardım çok takdir edilmektedir!

cevap

14

tekrar belgelere bakarsak, o component göreceksiniz bir bileşen için bir başvuru beklediğini değil, bir dize: özellik değerleri JSX yılında

component={HelloWorld} 
//  ^  ^

, "..." (sadece JavaScript gibi) bir dize temsil

ve {...}, rastgele bir JavaScript ifadesini temsil eder. Dolayısıyla "{HelloWorld}", {HelloWorld}'dan çok farklıdır.

+0

Hızlı yanıtınız ve sorunumu çözmeniz için teşekkür ederiz! Komik, bu tür şeyleri nasıl gözden kaçırdığınızı bir gazilyon kez nasıl ... – Meldon

+0

Teşekkür ederiz! Sadece sabahımı kurtardın. – Ivan

+0

Çözüm için teşekkürler. İşe yarıyor! –

İlgili konular