1

私は反応ボイラープレートを使用しており、この例に従って認証を実装し、認証状態に応じてサイドメニューを表示/表示しようとしているため、アプリコンポーネントを拡張するように変更しようとしています。ご覧のとおり、もともと props は props パラメータを介して App に渡されます。クラスを次のように変更しました。React.ComponentApp/index.js

import React from 'react';
import Header from 'components/Header';
import SideMenu from 'containers/SideMenu';
import Footer from 'components/Footer';
import auth from 'utils/auth'

export class App extends React.Component {
  render() {
  console.log(props)
  return (
      <div>
        <Header />
        <SideMenu />
        {React.Children.toArray(props.children)}
        <Footer />
      </div>
    );
  }
}

App.propTypes = {
  children: React.PropTypes.node,
};

export default App;

これにより、小道具が定義されていないというエラーがスローされます。

ReferenceError: props が定義されていません App.render **/App/index.js

ここでルートルートがどのようにインスタンス化されるかを確認できます:

// Set up the router, wrapping all Routes in the App component
import App from 'containers/App';
import createRoutes from './routes';
const rootRoute = {
  component: App,
  childRoutes: createRoutes(store),
};

どんな助けでも大歓迎です。

4

1 に答える 1