こんにちは、おーしまです。
今回は、1つ前のページに戻る「戻るボタン」についてです。
自動車レビューサイトでいろいろ試していると、検索をかけた状態から、レビューの詳細画面に遷移した後、トップページへ遷移するボタンしかなく、また検索をやり直さなければならないということがわかったので、戻るボタンの実装をすることにしました。
<%=link_to '戻る', :back, class:'back-btn' %>
こちらで実装できました。
:back をつけることで、一つ前のページに遷移することができます。
ただし、例えば、
「レビュー詳細ページ」と「ユーザー詳細ページ」の両方に、戻るボタンを設置した場合で、
- 「レビュー検索一覧ページ」→「レビュー詳細ページ」→「ユーザー詳細ページ」
の順に画面遷移したときは、戻るボタンを使用すると、
- 「ユーザー詳細ページ」→「レビュー詳細ページ」→「ユーザー詳細ページ」→「レビュー詳細ページ」
という風に、ループしてしまい、「レビュー検索一覧ページ」へ遷移することができなくなります。戻った場合も一つ前のページとして認識されてしまうようなので、注意が必要です。
実装してから気づいたのですが、ブラウザに付いている「←」ボタンで戻ることができました。
それに「←」ボタンの場合、ループすることなく、履歴を追って戻ることができるので、こちらの方が便利です。メルカリのサイトを見ていても、商品詳細から、戻るボタンは設置されていなかったので、ブラウザの「←」で戻るのが正当なのだと思います。(私は、せっかく作ったのでレビュー詳細画面にだけ設置した)
今回はここまでです。
お疲れ様でした。