प्रतिक्रिया-राउटर: 'Invariant उल्लंघन: अमान्य टैग: {HelloWorld}', जबकि घटक सही है

Question

मैं प्रतिक्रिया करने के लिए नया हूं और प्रतिक्रिया-राउटर (v1.0.0) के साथ गति प्राप्त करने की कोशिश कर रहा हूं।

मैंने एक साधारण घटक और एक साधारण मार्ग स्थापित किया है, लेकिन यह मुझे एक त्रुटि दे रहा है: Invariant Violation: Invalid tag: {HelloWorld}। आपको लगता है कि यह एक स्पष्ट त्रुटि है, लेकिन मुझे पता नहीं चल सकता कि कोड के साथ क्या गलत है।

संदेश यह है:

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')); 

अगर मैं ReactDom.render बयान में <HelloWorld /> साथ routes बाहर स्विच, यह ठीक काम करता है।

किसी भी मदद की बहुत सराहना की है!

Answer 1

आप फिर से प्रलेखन को देखें, तो आपको लगता है कि component देखेंगे एक घटक के लिए एक संदर्भ की उम्मीद है, न कोई स्ट्रिंग:

component={HelloWorld} 
//  ^  ^

JSX में गुणधर्म मान "..." एक स्ट्रिंग का प्रतिनिधित्व करता है (बस जावास्क्रिप्ट की तरह) , और {...} एक मनमाना जावास्क्रिप्ट अभिव्यक्ति का प्रतिनिधित्व करता है। इसलिए "{HelloWorld}"{HelloWorld} से बहुत अलग है।