link_toはRailsの基本!これであなたも必ずlink_toが書ける!

web開発

2016/07/06

web開発

Ruby on RailsでWEBアプリケーションなどを開発していると、必ず使うと言っても過言ではないメソッドの1つに、link_toメソッドが挙げられます。

link_toメソッドは、HTMLの<a>タグに相当します。(HTMLのタグについてはHTMLについて解説した記事をお読みください。)

本記事では、link_toメソッドの基本的なソースコードの書き方の紹介と、実際のWEBアプリケーションでlink_toメソッドを使ってみます。

また、link_toメソッドに似た、link_to_unless_currentというメソッドがあります。これもlink_toと同様によく使うメソッドなので、今回はこのlink_to_unless_currentメソッドの使い方にも触れていきます。

本記事だけでlink_toメソッドについて充実の内容です。ぜひ最後までお読みください。

link_toメソッドの基本的な書き方

link_toの基本的なソースコードの書き方を解説します。

link_toの第1引数にはリンクのテキスト、第2引数にはパスやURLを指定します。以下の例は、Yahooへのリンクを作成するものです。

【link_toの使い方:例】

<%= link_to “Yahooへ移動する”, “http://www.yahoo.co.jp/” %>

link_toの第2引数にはパスを指定することもできます。例えば、トップぺージへのリンクをパスを用いて作成する場合は以下のようになります。

【link_toでパスを用いる例】

<%= link_to “トップページ”, root_path %>

※パスを用いた作成方法については、次章の「link_toを使ってみよう!」で詳しく解説していきます。

また、link_toメソッドの第3引数には、ハッシュでmethodオプションや属性を指定できます。

【methodオプションを指定する例】

<%= link_to “削除”, member_path(params[:id]), method: :delete %>

methodオプションではHTTPメソッドの種類を指定します。何も指定しなければGETになります。

【属性を指定する例】

<%= link_to “TOP”, root_path, class: “menu” %>

これは、aタグの<a href=”/” class=”menu”>のようなタグになります。

以上がlink_toメソッドの基本的なソースコードの書き方です。特に難しそうなイメージはないと思います。以下からは、実際にlink_toを使ってみます。

 

link_toメソッドを使ってみよう!

link_toメソッドを使うために、まずはscaffold(簡単にWEBアプリケーションが作れる仕組み)を使ってdemo_appというWEBアプリケーションを作成しましょう。

ターミナルに以下のコマンドを打ち込みます。

rails new demo_app

cd demo_app

rails g scaffold Member name:string email:string

rake db:migrate

これでdemo_appというアプリケーションが作成されました。

では、引き続きターミナルに以下のコマンドを打ち込んでサーバーを起動させます。

rails server

メンバー新規作成のぺージ(app/views/member/new.html.erb)を表示させてみます。ブラウザに以下のURLを入力してください。

http://localhost:3000/members/new

すると、以下のような画面が表示されます。

link_toメソッド解説画像

このぺージにある、Backというリンクの隣に、メンバー一覧のぺージ(app/views/member/index.html.erb)へのリンクをlink_toメソッドでパスを用いて作成してみましょう。

まずは、indexアクションのパスを調べることが必要ですね。

各アクションのパスは、「rake routes」というコマンドで調べることができます。では、ターミナルに以下のコマンドを打ち込んでください。

※サーバーが起動したままになっている人は「control+C」を押してサーバーを停止させてから以下のコマンドを打ち込んでください。

rake routes

すると、以下のような画面が現れます。

link_toメソッド解説画像

一番左にある、Prefixという列に「_path」をつけたものが、各アクションへのパス(リンク)になります。

indexアクションならmembers_path、showアクションならmember_pathになります。

※showアクションとdestroyアクションなどは同じパスですが、Verbが違うので、それで区別します。この部分の詳しい説明は割愛させて頂きます。

では、メンバー新規作成のぺージ(app/views/member/new.html.erb)を開いて、ファイルの一番下に以下のlink_toのソースコードを記述します。

<%= link_to “メンバー一覧”, members_path %>

そして、もう一度「rails server」コマンドでサーバーを立ち上げて、ブラウザに「http://localhost:3000/members/new」を入力します。以下の画面になっていれば問題ありません。

link_toメソッド解説画像

では、link_toで作成した「メンバー一覧」リンクをクリックします。以下の画面に移動できれば成功です。

link_toメソッド解説画像

URLも「http://localhost:3000/members」になっていることを確認してください。

いかがでしたか?link_toメソッドについて大体理解できましたか?各アクションのパスを調べるときに使った「rake routes」コマンドは非常に便利なので、必ず覚えておきましょう。

 

link_to_unless_currentメソッドとは?

最後に、link_toメソッドによく似たlink_to_unless_currentメソッドを紹介します。

link_to_unless_currentメソッドを使うと、「第2引数で指定したパスが現在のぺージだったら、リンクの代わりにテキストだけ表示する」ということができます。

例えば、以下のようなソースコードを記述したとします。

<%= link_to_unless_current “TOP”, root_path %>

このソースコードは、自分が今、TOPページ(root_path)にいるとすれば、「TOP」というリンクはクリックできないようにするという意味です。

例えば、TOP・ニュース・ブログというメニューがあり、自分が今、TOPぺージにいる場合のイメージとしては、以下のようになります。

link_toメソッド解説画像

このような仕組みは皆さんも1度は目にしたことがあるのではないでしょうか?この仕組みはlink_to_unless_currentメソッドで実現できるのです。

 

いかがでしたか?本記事でlink_toメソッドについて理解できましたか?link_toメソッドはRailsでプログラムを組めばほぼ必ず使うメソッドです。必ずlink_toメソッドはマスターしておいてください。

udemyでは、Ruby on Rails初心者でも3日間でWEB開発ができるような講座を開設しています。ぜひこちらもチェックしてみてください。

  

短期間でRailsをマスターしたい人におすすめです

【3日でできる】はじめての Ruby on Rails 4 入門(Rubyから学べる) - Udemy

【3日でできる】はじめての Ruby on Rails 4 入門(Rubyから学べる) - Udemy

Ruby on Railsをマスターしたら、あなたはどんなWebサービスを作りますか?

動画で学習する

  • シェア
  • ツイート
  • Poket
  • はてなブックマーク
  • フォロー
  • シェア
  • ツイート
  • Poket
  • はてなブックマーク
  • フォロー

関連記事