吉本集の個人ブログ
Web制作の技術について書いています。たまに日記も書きます。

【Rails】Viewの基本構造 vol.2

2015年10月11日 / category : rails

前回の記事では、Viewの基本的な仕組みについて書きましたので、今回はもう少し付け加えてみます。

http://localhost:3000/hello/index/

このURLを叩くと、helloコントローラのindexアクションメソッドが実行されます。
そのテンプレート参照先が

/app/views/コントローラ名/アクション名.html.erb

になります。これは、デフォルトの設定です。
この参照先を変更したい場合は、次のようにします。

hello_controller.rb
class HelloController < ApplicationController
      def index
      	render 'hello/index2'
      end
end

renderメソッドで、参照先を指定できるようです。パスは/app/views/からの相対パスです。
.html.erbの拡張子も不要です。これで、

/app/views/hello/index2.html.erb

こちらのテンプレートファイルを参照することになります。

続いて、コントローラからテンプレートファイルに、変数を渡したい場合ですが、
コントローラに次のような記述をします。

hello_controller.rb
class HelloController < ApplicationController
      def index
      	@name = '吉本'
      end
end

これでコントローラ側に変数を定義しました。これをテンプレートファイルで受け取るには、

index.html.erb
こんちにわ、<%= @name %>

これで変数を受け取ることができます。

続けて、HTTPサーバーを起動し、

http://localhost:3000/hello/index/

にアクセスし、ソースを見てくると、’こんちにわ、世界!’以外にソースが記述されているのがわかります。

http://localhost:3000/hello/index/のソース
<!DOCTYPE html>
<html>
<head>
・・・省略
</head>
<body>

こんばんわ、世界!

</body>
</html>

html要素と、head要素、そしてbody要素が記述されています。い、いつの間に!
テンプレートファイルには、’こんばんわ、世界!’しか記述していません。
では、その他の要素はどこから来たのでしょうか。

仕組みとしては、前回説明した通り

http://localhost:3000/コントローラ名/アクション名/

にアクセスすると、コントローラでテンプレートファイル参照先がデフォルトのままであれば、

/app/views/コントローラ名/アクション名.html.erb

このファイルを参照することになりますが、これは個別テンプレートになり、個別テンプレートを埋め込む共通テンプレートファイルというのが存在します。
このファイルをレイアウトテンプレートと呼びます。

格納してある場所は、次になります。

/app/views/layouts/application.html.erb

コードを見てみると、html要素と、head要素、そしてbody要素が記述されているのが、わかります。
個別テンプレートファイルを埋め込んでいる個所は、

<%= yield %>

になります。

application.html.erb
<!DOCTYPE html>
<html>
<head>
  <title>Helloworld</title>
  <%= stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track' => true %>
  <%= javascript_include_tag 'application', 'data-turbolinks-track' => true %>
  <%= csrf_meta_tags %>
</head>
<body>

<%= yield %>

</body>
</html>

以上が、ControllerとViewの仕組みになります。