ボタンの下にラベルを追加し、詳細ページにジャンプしthis.props.history.pushこの機能により、onClickイベントを追加します。このオブジェクトの歴史の中でルーティングコンポーネントで追加したコードは、コンポーネントが行く小道具に登録され、その後、あなたはサブアセンブリで歴史を呼び出すプッシュ方式の小道具でページをジャンプすることができます。
多くのシーンでは、我々はまた、同時にページジャンプをパラメータを渡す必要があり、反応し-ルータ-DOM、同じことが質量参加の二つの方法を提供しています。
暗黙のパラメータの受け渡し
また、プッシュ機能も暗黙のパラメータを渡すことができます。
次のようにHome.js変更されたコードです。
detail.jsで、あなたは家に帰る上を通過this.props.history.location.stateパラメータを使用することができます。
componentDidMount() {
//console.log(this.props.match.params);
console.log(this.props.history.location.state);
}
ジャンプの後には、パラメータが印刷されているオープンコンソールを見ることができます:
その他の機能
置き換えます
いくつかのシナリオでは、再利用のプッシュやジャンプラベルは、このような状況を避けるために、反応-ルータ-DOMが代わるの提供、デッドサイクルを持つことになります。ジャンプして発生する可能性が無限ループの代わりに置き換える使用します。
this.props.history.replace('/detail');
戻る
シナリオは、使用している場合、前のページに戻る必要があります:
this.props.history.goBack();