リンクの作成

リンクを追加する (1)

吉田先生

独立している各ページをリンクで繋ぎ、行き来できるようにします。

• リンクを追加する

リンクを追加する (1)

前教程までで、トップページに指定したwelcomeフォルダ内のindex.html.erbと、articlesフォルダ内にある新しく記事を投稿するnew.html.erb、投稿した記事を表示するshow.html.erb、記事の一覧を表示するindex.html.erbの4つのviewを作成しました。

つまり、4種類のページをブラウザで表示することができるということです。

しかし、各ページへアクセスする為に毎回ドメインに/articles/newや/articles/:idなどのURIを追加して表示するのは面倒です。

そこでそれぞれのページをつなげるリンクを作成します。

1.articles#indexにリンクを張る

トップページから記事一覧にリンクをはってみましょう。

welcome/index.html.erbファイルに以下のコードを追加してください。

<%= link_to "詳細を見る", article_path %>

ファイルにコードを追加、保存したらブラウザを更新してみましょう。

トップページに　記事一覧へ　というリンクが作成されており、リンクを押すと記事一覧ページへ画面が遷移しました。

link_toはリンク作成用に用意されているRailsのヘルパーメソッドです。link_toに続けて指定されたテキスト（記事一覧へ）にリンクを作成し、続けてジャンプ先を指定します。

※リンクを作成するテキストは文字列の為、ダブルクォーテーショで囲みます。

ジャンプ先のパスは$ rake routesで確認できるPrefix+pathです。

ここでは記事一覧（articles/index.html.erb）のパスを指定しています。

link_toメソッドを使って作成したリンクは

<a href=〇〇>

というHTMLとしてブラウザの裏では出力されています。

<a href=〇〇>はリンクを作成するHTMLコードでしたね。

ここでもlink_toメソッドを使うことで簡単にリンクを作成できていることがわかります。

次のレッスンでは、他のページへのリンクや戻るリンクを作成します。