ルートを使用して子供に小道具を渡します

Question

私が求めていることについて多くの質問と回答がありますが、私はそれを読んで正しく適用しているように感じています。毎回props

出会いましょう= { タイトル： 'いくつかのタイトル'、 }

は、だから私はここに私の親コンポーネントを持っています。私はちょうどconsole.logthis.props私が見ることができないとき

Meteor.startup(() => { 
    render((
    <Router> 
     <div> 
     <Nav /> 
     <Route exact path="/" component={Start} dataMeeting={meeting} /> 
     <Route path="/app" component={App} /> 
     <Modal /> 
     </div> 
    </Router> 
), document.getElementById('render-target')); 
}); 

はその後、私のStart成分である私の他のファイルに私はconsole.log私console.logで

export default class Start extends Component { 
    render() { 
    console.log(this.props.dataMeeting); 
    return (
     <div className="home"> 
     <p>test</p> 
     </div> 
    ); 
    } 
} 

this.propsに私は戻って未定義得るか、およびオブジェクトの私のdataMeeting。

なぜ私は誤解しているのですか？

ありがとうございます！

<Route path="/" render={()=><Start dataMeeting={meeting} />}/> 

@ToddChaffeが指摘したように、あなたはできる（ただしべきではありません）にcomponent小道具を使用します。

Answer 1

あなたがreact-router V4を使用しているように、あなたの代わりにcomponentのrender小道具を使って、小道具を渡すことができルックス同じ方法：

<Route path="/" component={()=><Start dataMeeting={meeting} />}/> 

ただし、すべてのレンダリングでコンポーネントが再作成されます。

Answer 2

これは文書化されていませんが、this.props.routeを使用してください。

export default class Start extends Component { 
    render() { 
    console.log(this.props.route.dataMeeting); 
    return (
     <div className="home"> 
     <p>test</p> 
     </div> 
    ); 
    } 
}