【Rails】ヘルパーメソッドのリンクでアンカーを指定する方法

2019年10月10日 21:30

    はじめに

    アンカーリンクとは、例えば以下のようなタグのことです。
    <a href="#comment">コメント</a>
    ...
    <a name="comment"></a>
    通常のリンクはリンク先ページの先頭に遷移しますが、アンカー名(「#」付きの文字列)を指定することで、リンク先ページのさらに指定した箇所へ遷移させることができます。
    上の例ではリンク先ページ下部(を想定)のコメントへのリンクを指定しています。
    ちなみに、指定したアンカー名がリンク先ページに存在しない場合、リンク先ページの先頭に遷移します。

    Railsのリンク

    Railsでは通常、上記のようなリンクタグ(<a href="...">...</a>)は使いません。
    Railsに初めから用意されているヘルパーメソッドを使うのが一般的です。
    # Controller
    redirect_to article_path(params[:id])
    
    # View
    <%= link_to article.title, article_path(article.id) %>
    「redirect_to」や「link_to」がヘルパーメソッドになります。
    これらの引数に指定されている「article_path」がリンク先を表すのですが、もちろんこの文字列自体がリンク先というわけではありません。
    Railsが自動生成した特殊な変数のようなもので、この中にリンク先が格納されているイメージです。

    アンカーの指定方法

    ヘルパーメソッドを使ったリンクでアンカーを指定するには、以下のようにします。
    # Controller
    redirect_to article_path(params[:id], anchor: 'comment')
    
    # View
    <%= link_to article.title, article_path(article.id, anchor: 'comment') %>
    タグのときのようにアンカー名の先頭に「#」を付ける必要はありません。
    ちなみに、同じページ内でアンカー指定するには以下のようにします。
    # View
    <%= link_to article.title, '#comment' %>
    この場合はアンカー名の先頭に「#」を付ける必要があります。

    関連記事

    関連記事はありません。