未定義のプロパティ 'props'を読み取ることができません - リアクタのルータ

Question

私はリアクションサーバを使用してネストされたルーティングを実行しようとしています。しかし、私は反応するコード

const App =() => { 
    return (
     <div> 
      <h2>{'Nested Routing App'}</h2> 
      <ul> 
       <li> 
        <Link to="/view1">{'View1'}</Link> 
       </li> 
      </ul> 
      {this.props.children} 
     </div> 
    ); 
}; 

const View1 =() => { 
    return(
     <h3>{'Welcome to View1'}</h3> 
    ); 
}; 


render(
    <Router> 
     <Route component={App} path="/"> 
      <Route component={View1} path="/view1"></Route> 
     </Route> 
    </Router>, 
document.getElementById('app')); 

間違っているかもしれないものを任意のアイデアここで

Uncaught TypeError: Cannot read property 'props' of undefined 

を述べブラウザコンソールでエラーが発生している取得していますか？

Answer 1

arrow functionsには字句がありませんthis。また、機能コンポーネントは関数の引数として小道具を受け取ります。だから、これを行うための正しい方法は次のようになります。..

const App = (props) => { 
    return (
     <div> 
      <h2>{'Nested Routing App'}</h2> 
      <ul> 
       <li> 
        <Link to="/view1">{'View1'}</Link> 
       </li> 
      </ul> 
      {props.children} 
     </div> 
    ); 
}; 

https://facebook.github.io/react/docs/components-and-props.html

ここで続きを読みます