反应路由器错误 - '不能调用方法'getRouteAtDepth'未定义'

我试图在我的应用程序上实现react-router。我的主要文件包含以下代码：反应路由器错误 - '不能调用方法'getRouteAtDepth'未定义'

'use strict'; 

import 'babel/polyfill'; 
import React from 'react/addons'; 
import App from './components/App'; 
import ContentPage from './components/ContentPage'; 
import Dispatcher from './core/Dispatcher'; 
import AppActions from './actions/AppActions'; 
import Router from 'react-router'; 

var { Route, RouteHandler, Link } = Router; 

function run() { 

    var routes = (
    <Route name="app" path="/" handler={App}> 
     <Route handler={ContentPage}/> 
    </Route> 
); 

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

}

里面我应用组件我有这样的代码：

render() { 
    return (
     <div className="App"> 
     <RouteHandler /> 
     </div> 
    ); 
    }

此代码生成以下错误：

TypeError: Cannot call method 'getRouteAtDepth' of undefined 
    at RouteHandler.createChildRouteHandler

如果我改变<RouteHandler />直接<ContentPage />，代码有效。任何想法我做错了什么？

编辑：很显然，我是用“React starter kit”，这使得在服务器上的“应用程序”组件为好。将反应路由器添加到该组件时，会产生此（服务器端）错误。

我不需要服务器端渲染我的项目，所以删除这个解决了我的问题。我会尽力调查为什么这件事发生在我有空的时候。

来源

2015-04-04 Yaniv Efraim

您使用的是哪个版本的React？ – 2015-04-04 09:36:43

react版本：“0.13.0”，react-router：“0.13.2” – 2015-04-04 09:58:12

这是怎么回事：https://github.com/rackt/react-router/issues/720 – WiredPrairie 2015-04-04 12:38:16

尽量将您router为App组件模块是这样的：

var React = require('react'), 
    Router = require('react-router'), 
    Route = Router.Route, 
    RouteHandler = Router.RouteHandler, 
    ContentPage = require('./components/ContentPage'), 
    App, routes; 

App = React.createClass({ 
    render: function(){ 
     return (
       <div className="App"> 
        <RouteHandler /> 
       </div> 
     ); 
    } 
}); 

routes = (
    <Route name="app" path="/" handler={App}> 
     <Route handler={ContentPage}/> 
    </Route> 
); 

module.exports = { 
    run: function() { 
     Router.run(routes, function (Handler) { 
      React.render(<Handler/>, document.body) 
     }); 
    } 
};

和适当的run模块将似乎是这样的：

var AppRunner = require('./component/App'); 
AppRunner.run();

只是在你的ES6方式重构这个，我希望它会帮助你。

来源

2015-04-07 12:36:58

反应路由器错误 - '不能调用方法'getRouteAtDepth'未定义'

回答

相关问题