React-routera: type.toUpperCase nie jest funkcją

Question

kiedy po raz pierwszy użyć reagować-routera, ale strona daje mi ten błąd poniżej

React-Router: type.toUpperCase nie jest funkcją

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

wydaje się, że dokument nie zawiera niczego złego, ktoś mógłby mi pomóc?

gdzie błąd pochodzi tutaj

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

Answer 1

zmianę require sprawozdań:

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

Answer 2

Błąd zostanie zaksięgowana jest tajemniczy, ale co to znaczy, to staramy się uczynić komponent z zmiennej, która nie jest rzeczywistym elementem. Na przykład, można to zrobić i uzyskać ten sam rodzaj błędu:

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

w kodzie ty pisał, <Router> mapy do zmiennej, która jest modułem, a nie składnik. Możesz go naprawić nową deklaracją zmiennej:

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

Otrzymałem ten sam błąd. Wtedy domyślam się, że popełniłem błąd podczas eksportu moich komponentów. W jednym komponencie napisałem moduł.export zamiast module.exports. Więc sprawdź, czy popełniłeś ten sam błąd.

Answer 4

jeśli używasz reagować-Router v0.13.3 zastąpić Route r na Szlaku tak:

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

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