未定義のプロパティ 'params' を読み取ることができません (React Router 4) 質問する

未定義のプロパティ 'params' を読み取ることができません (React Router 4) 質問する

コンポーネントをレンダリングするためのルートを設定しました:

<Route exact path="/page/:id" location={this.props.location} key={this.props.location.key} render={({ location }) => (
    <PageStart key={this.props.location.key} />
)} />

そして、そのコンポーネント (PageStart) 内には次のものがあります。

this.props.match.params.id

しかし、エラーが発生します:

Cannot read property 'params' of undefined

単に呼び出すときにプロパティを渡すとcomponent={}正常に動作するようですが、レンダリング関数では動作しません。なぜでしょうか?

ベストアンサー1

なぜなら、render一致、履歴など、ルーターによってコンポーネントに渡されるデフォルトのプロパティが渡されていないためです。

次のように書くと:

<PageStart key={this.props.location.key} />

コンポーネントpropsに値がないことを意味します。PageStart

次のように書きます:

render = {props => <PageStart {...props} key={this.props.location.key} /> } />

ここで{...props}すべての値がPageStartコンポーネントに渡されます。

おすすめ記事