React路由器 - 动态路由设置

Question

我确定我在这里丢失了一些简单的东西，但无法正确配置我的路由。

我得到这个错误：

Warning: Failed prop type: The prop 'children' is marked as required in 'App', but its value is 'undefined'. in App (created by RouterContext) in RouterContext (created by Router) in Router

这里是我的基本设置：

./index.jsx

import React from 'react'; 
import ReactDOM from 'react-dom'; 
import {Router, browserHistory} from 'react-router'; 
import routes from './routes'; 

ReactDOM.render(
    <Router history={browserHistory} routes={routes}/>, document.getElementById('root')); 

./routes/index.js

个

module.exports = { 
    path: '/', 
    component: require('../components/app'), 
    indexRoute: require('./home') 
}; 

./routes/home.js

module.exports = { 
    getComponent(nextState, cb) { 
    require.ensure([], (require) => { 
     cb(null, require('../components/home')); 
    }); 
    } 
}; 

./components/app/index.jsx

import React, {PropTypes} from 'react'; 

const App = props => (
    <section> 
    <h1>My App</h1> 
    <section>{props.children}</section> 
    </section> 
); 

App.propTypes = { 
    children: PropTypes.node.isRequired 
}; 

export default App; 

./components/home/index.jsx

import React from 'react'; 

const Home =() => (
    <section> 
    <h3>Home</h3> 
    </section> 
); 

export default Home; 

Answer 1

当需要使用导出文件时，您需要指定.default。 Home将没有它是不确定的，因此错误

./routes/home.js

module.exports = { 
    getComponent(nextState, cb) { 
     require.ensure([], (require) => { 

     // need to specify .default when requiring a file using export 
     cb(null, require('../components/home').default); 
     }); 
    } 
};