ちょっとしたことですが、コピペできると便利だろうなぁと思い、まとめ。
React Router で戻るボタンを実装する方法です。
参考にした記事はこちら。
React Routerのhistoryはどこから来るのか｜TECHSCORE BLOG
http://www.techscore.com/blog/2017/12/01/where_does_react-router-history_come_from/
React 及び React Router の導入方法については割愛。
おそらく、Qiita あたりにわかりやすい記事があると思うので、そちらを参考にしてください。
実装方法…というか、前ページへ戻るための処理は下記の通りです。
this.props.history.goBack()
ページ遷移の時は、this.props.history.push('[遷移先]'); ですが、前のページに戻る時は最後が goBack() になります。
わかりやすいですね！
で、戻るボタン実装の際は、下記の通りです。
<button onClick={() => this.props.history.goBack()}>戻る</button>
よく、onClick に処理を書く際、最初の () => を書き忘れそうになるので、まるっとコピーできるように…。
…上記のコードはそのままコピー＆ペーストで動くかと思いますので、是非ご活用ください
以上、React Router で戻るボタンを実装する方法でした。
