反應路由器遺漏的類型錯誤：無法讀取屬性「toUpperCase」的未定義

Question

我試圖使用反應路由器，但是當我寫一個簡單的路線不工作，並在控制檯顯示遺漏的類型錯誤：無法讀取屬性「toUpperCase」的未定義。

否則當我使用沒有反應，路由器能很好的

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

的錯誤是從該行的反應庫

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

Answer 1

您正在使用從1.0測試文檔的例子，但你很可能運行最新的穩定版本（0.13）。主文檔中的文檔來自1.0 Beta，這是混淆的根源。

閱讀最新的穩定版本的文檔：https://github.com/ReactTraining/react-router/tree/master/docs

Answer 2

我的猜測是，當React.render是執行，路由器還沒有。試試這個

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

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

Answer 3

在React.render()嘗試<Route>而不是<Router>。

Answer 4

我仍然包裹我的頭周圍反應的路由器，但我檢查的第一件事是你正在使用的版本和文檔的參考。我能得到它通過執行以下工作...

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

基本上什麼PhInside說，但包裹在window.onload