असीमित त्रुटि: Invariant उल्लंघन: तत्व प्रकार अमान्य है: ऑब्जेक्ट

Question

मैं react-router के साथ tinkering कर रहा हूँ, सरल रूटिंग लागू करने के लिए tying। मैं अपने कोड को उनके उदाहरण में लिखे गए टाइप करता हूं (लेकिन बिना import एस) https://github.com/rackt/react-router#whats-it-look-like।

और मैं एक ब्राउज़र में इस त्रुटि मिलती है:

Uncaught Error: Invariant Violation: Element type is invalid: expected a string (for built-in components) or a class/function (for composite components) but got: object.

यहाँ मैं क्या कर रहा है।

मैं पृष्ठ पर स्क्रिप्ट संलग्न करता हूं, ReactRouter.min.js और react-routes.js में मेरा कोड संलग्न करता है। और यह भी react और react-dom और jQuery (app.js में सभी तीन):

<script src="/js/app.js" type="text/javascript" charset="utf-8"></script> 
<script src="https://npmcdn.com/react-router/umd/ReactRouter.min.js"></script> 
<script src="/js/react-routes.js" type="text/javascript" charset="utf-8"></script> 

यहाँ मेरी react-router.js है, फिर भी संकलित नहीं:

'use strict'; 
window.Router = window.ReactRouter; 
window.Link = window.ReactRouter.Link; 
window.Route = window.ReactRouter.Route; 

const Foo = React.createClass({ 
    render() { 
     return (
      <div> 
       <h1>HELLO, me FOO</h1> 
      </div> 
     ) 
    } 
}); 

ReactDOM.render((
    <Router> 
     <Route path="/" > 
      <Route path="/page/one" component={Foo}/> 
     </Route> 
    </Router> 
), document.getElementById('content-section')) 

इस कोलाहल के साथ अपने संकलन react-router.js के बाद है। मैं वास्तव में इस देते पृष्ठ पर:

babel --presets react -o public/js/react-routes.js assets/js/react-routes.js:

'use strict'; 

window.Router = window.ReactRouter; 
window.Link = window.ReactRouter.Link; 
window.Route = window.ReactRouter.Route; 

const Foo = React.createClass({ 
    displayName: "Foo", 

    render() { 
     return React.createElement(
      "div", 
      null, 
      React.createElement(
       "h1", 
       null, 
       "HELLO, me FOO" 
      ) 
     ); 
    } 
}); 

// Error is thrown here, in this line 
ReactDOM.render(React.createElement(
    Router, 
    null, 
    React.createElement(
     Route, 
     { path: "/" }, 
     React.createElement(Route, { path: "/page/one", component: Foo }) 
    ) 
), document.getElementById('content-section')); 

मैं गलत क्या करते हैं? त्रुटि क्यों फेंक दी जाती है? राउटर एक वस्तु है, एक प्रतिक्रिया घटक नहीं है। क्यूं कर? मैं इस उदाहरण को देखो और मेरी कोड उसी तरह टाइप https://github.com/rackt/react-router#whats-it-look-like

Answer 1

आपका

window.Router = window.ReactRouter; 

window.Router = window.ReactRouter.Router; 

आपको त्रुटि क्योंकि आप <Router /> उपयोग करने के लिए कोशिश कर रहे हैं हो रही है होना चाहिए , लेकिन Router रिएक्ट राउटर लाइब्रेरी का संदर्भ है (और Router घटक नहीं)।