1

ここで単純なものが欠けていると確信していますが、ルートを適切に構成できません。

次のエラーが表示されます。

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;

./コンポーネント/ホーム/index.jsx 

import React from 'react';

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

export default Home;
4

1 に答える 1

1

.defaultexport を使用してファイルを要求する場合は、指定する必要があります。ホームはそれなしでは定義されないため、エラーが発生します

./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);
        });
    }
};
于 2016-12-03T00:50:38.360 に答える