React-Router: type.toUpperCase ist keine Funktion

Question

, wenn ich zum ersten Mal verwenden-Router reagieren, aber Seite gibt mir diesen Fehler unter

React-Router: type.toUpperCase ist keine Funktion

var React = require('react'); 
var Router = require('react-router'); 

var Route = Router.Route; 

var App = React.createClass({ 

    render: function() { 
    return (
     <div>App</div> 
    ); 
    } 
}); 

React.render((
    <Router> 
    <Route path="/" component={App} /> 
    </Router> 
), document.getElementById('app')); 

es scheint nichts falsch aus dem Dokument, könnte jemand mir helfen?

wo Fehler hier

function autoGenerateWrapperClass(type) { 
    return ReactClass.createClass({ 
     tagName: type.toUpperCase(), 
     render: function() { 
     return new ReactElement(
      type, 
      null, 
      null, 
      null, 
      null, 
      this.props 
     ); 
     } 
    }); 
    } 

Answer 1

Änderung der erfordern Aussagen kommt: aus einer variablen

var React = require('react'); 
var ReactRouter = require('react-router'); 
var Router = ReactRouter.Router; 
var Route = ReactRouter.Route; 

Answer 2

Der Fehler Sie auf dem Laufenden ist kryptisch, aber was es bedeutet, ist, dass Sie versuchen, zu machen, eine Komponente, die ist keine echte Komponente. Zum Beispiel könnten Sie dies tun und die gleiche Art von Fehlern:

render: function() { 
    var Thing = {}; // not a component 
    return <Thing />; // same error 
} 

Im Code, den Sie geschrieben, <Router> Karten auf eine Variable, ein Modul ist, nicht eine Komponente. Sie können es mit einer neuen Variablendeklaration beheben:

var React = require('react'); 

var routerModule = require('react-router'); 
var Router = routerModule.Router; // component 

var Route = routerModule.Route; 

var App = React.createClass({ 

    render: function() { 
    return (
     <div>App</div> 
    ); 
    } 
}); 

React.render((
    <Router> 
    <Route path="/" component={App} /> 
    </Router> 
), document.getElementById('app')); 

Answer 3

Ich bekam den gleichen Fehler. Dann stelle ich fest, dass ich beim Export meiner Komponenten Fehler gemacht habe. In einer Komponente habe ich module.export statt module.exports geschrieben. Also, bitte überprüfe, ob du den gleichen Fehler gemacht hast.

Answer 4

, wenn Sie verwenden reagieren-Router v0.13.3 ersetzen Strecke r auf der Route, wie folgt aus:

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

Router.run(routes, function(Root) { 
React.render(<Root />, document.getElementById('app')); 
});