react-router Uncaught TypeError: Kann die Eigenschaft 'toUpperCase' von undefined nicht lesen

Question

Ich versuche den react-Router zu verwenden, aber wenn ich eine einfache Route schreibe, funktioniert das nicht und die Konsole zeigt Uncaught TypeError: Eigenschaft 'toUpperCase' kann nicht gelesen werden von undefiniert.

Sonst, wenn ich ohne die reagieren-Router verwenden, die gut funktionieren

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

var App = React.createClass({ 
    render: function() { 
     return (
      <div>Hello World</div> 
     ); 
    } 
}); 


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

Der Fehler ist von dieser Linie von der Bibliothek reagieren

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

Answer 1

Sie verwenden Beispiele von 1.0 Beta-Dokumentation zum Laufen bringen, aber Sie sind wahrscheinlich Laufen die neueste stabile Version (0.13). Die Dokumente im Master stammen aus der Beta 1.0, das ist die Quelle der Verwirrung.

Lesen Sie die Dokumentation für die aktuelle stabile Version: https://github.com/ReactTraining/react-router/tree/master/docs

Answer 2

Meine Vermutung ist, wenn React.render auszuführen ist, der Router ist noch nicht da. versuchen, diese

var routes = (
    <Route handler={App}> 
    </Route> 
); 

Router.run(routes,(Root) => { 
    React.render(<Root/>, document.body); 
}); 

Answer 3

Versuchen <Route> statt <Router> in React.render().

Answer 4

Ich bin immer noch um den Reaction-Router gewickelt, aber das erste, was ich überprüfen würde, ist die Version, die Sie verwenden und die Dokumente, auf die Sie verweisen. Ich konnte es, indem Sie folgende ...

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

var App = React.createClass({ 
    render: function() { 
     return (
      <div>Hello World</div> 
     ); 
    } 
}); 

var routes = (
    <Route handler={App}> 
    </Route> 
); 

window.onload = function() { 
    ReactRouter.run(routes, ReactRouter.HistoryLocation, function(Root, state) { 
     React.render(
      <Root />, 
      document.getElementById('main') 
     ) 
    }); 
}; 

Im Grunde, was PhInside gesagt, aber verpackt in window.onload