#author("2018-04-27T06:38:42+00:00","ohneta","ohneta")

*React <Router>でcomponentにpropsを渡す [#p513dcf2]

recompose/withPropsを使うと、propsを渡せる

**recomposeをインストール [#taf3b290]
 
 yarn add recompose
 

withPropsでpropsとcomponentを指定。

 import withProps from 'recompose/withProps';
 
 (componetクラス)
  
 <Router>
 
   (...中略...)
 
      <Route exact path="/11" component={withProps(() => ({...this.props, foo:{xx:'111', yy:'222'}}))(PageTop)} />
 
   (...中略...)
 
 </Router>
 
 (...後略)


バラして書くとこんな感じ。

 class FooBar extends React.Component {
 
   render() {
     const pp = {  ...this.props,
                   foo:{
                     xx:'111',
                     yy:'222'  }
                 }
 
     return (
       <Router>
          <div>
             <Switch>
               <Route exact path="/0" component={SomePage} />
               <Route exact path="/1" component={withProps(() => ({...this.props, foo:{xx:'111', yy:'222'}}))(SomePage)} />
               <Route exact path="/2" component={withProps(() => (pp))(SomePage)} />
             </Switch>
       </Router>
     )
   }
 }



トップ   新規 一覧 単語検索 最終更新   ヘルプ   最終更新のRSS