Layout in Rails - goody9807－IT工程師數位筆記本

文章出處

參考鏈接：http://guides.rubyonrails.org/layouts_and_rendering.html#structuring-layouts

layout

layout最基本的使用很簡單，默認的layout是app/views/layout目錄里與controller同名的模板。如果要指定為其它布局，可以在controller里調用layout方法，像這樣：

Ruby代碼

class ProductsController < ApplicationController
layout "inventory"
#....
end

之后，所有的action都將以app/views/layout/inventory.html.erb為布局來渲染模板。layout方法還支持:except和:only兩個選項，用來選擇layout方法影響到的action，顧名思義吧，不記了。

Ruby代碼

layout "product", :except => [:index, :rss]

動態布局
當layout方法的參數為一個symbol的時候，這個controller的布局是動態的，必須在controller里定義一個與symbol對應的方法（一般為private即可），這個方法必須返回一個字符串，用作指定布局的名字：

Ruby代碼

class ProductsController < ApplicationController
layout :products_layout
def show
@product = Product.find(params[:id])
end
private
def products_layout
@current_user.special? ? "special" : "products"
end
end

也可以這樣寫：

Ruby代碼

class ProductsController < ApplicationController
layout proc { |controller| controller.request.xhr? ? 'popup' : 'application' }
# ...
end

結構化布局（Structuring Layouts）

Asset Tags

javascript_include_tag
在頁面中引入js文件：public/javascripts/main.js:

Ruby代碼

<%= javascript_include_tag "main" %>

引入public/javascripts/main.js 和 public/javascripts/columns.js:

Ruby代碼

<%= javascript_include_tag "main", "columns" %>

引入public/javascripts/main.js 和 public/photos/columns.js:

Ruby代碼

<%= javascript_include_tag "main", "/photos/columns" %>

引入http://example.com/main.js:

Ruby代碼

<%= javascript_include_tag "http://example.com/main.js" %>

:defaults 選項可用于引入Prototype 和 Scriptaculous 庫:

Ruby代碼

<%= javascript_include_tag :defaults %>

:all 選項加載public/javascripts目錄下的每個js文件, 以Prototype 和 Scriptaculous開頭:

Ruby代碼

<%= javascript_include_tag :all %>

:recursive 選項用于指定是否包含public/javascripts目錄的子目錄中的js文件:

Ruby代碼

<%= javascript_include_tag :all, :recursive => true %>

如果你加載了多個js文件，可以通過設置:catch選項為true來組合多個js文件到一個js文件中，從而增強用戶體驗。 :

Ruby代碼

<%= javascript_include_tag "main", "columns", :cache => true %>

默認的，這些js文件將被組合到javascripts/all.js中。你可以手動指定一個緩存文件的位置:

Ruby代碼

<%= javascript_include_tag "main", "columns", :cache => 'cache/main/display' %>

甚至可以使用動態的路徑，像這樣：cache/#{current_site}/main/display.

stylesheet_link_tag

stylesheet_link_tag的使用大致和javascript_include_tag相同，只是沒有那個:defaults選項。另外，stylesheet_link_tag多了:media、:rel和:type三個選項，用于指定stylesheet link的media、rel和type值，默認值為：media="screen" rel="stylesheet" type="text/css"。

layout中的yield

在layout里面，yield用來標識view應該插入的地方。像這樣：

Html代碼

<html>
<head>
</head>
<body>
<%= yield %>
</body>
</html>

帶參數的yield一般與content_for一起使用：

Html代碼

<html>
<head>
<%= yield :head %>
</head>
<body>
<%= yield %>
</body>
</html>
<% content_for :head do %>
<title>A simple page</title>
<% end %>
Hello, Rails!
<html>
<head>
<title>A simple page</title>
</head>
<body>
Hello, Rails!
</body>
</html>

partial

把partial作為view的一部分來渲染，可以調用render方法：

Ruby代碼

<%=render :partial=>"menu"%>

上面的代碼會把文件名為_menu.html.erb的模板渲染到當前模板中。

Ruby代碼

<%= render :partial => "shared/menu" %>

渲染app/views/shared/_menu.html.erb到當前模板。
可以為partial單獨指定layout：

Ruby代碼

<%= render :partial => "link_area", :layout => "graybar" %>

partial的layout文件名必須以下劃線開頭：_graybar.html.erb，而且必須把layout模板文件和partial放在同一個目錄下。

給partial傳遞局部變量
:locals選項用于設置partial的局部變量：

Ruby代碼

<%= render :partial => "form", :locals => { :button_label => "Create zone", :zone => @zone } %>

這樣就可以在_form.html.erb中訪問button_label和zone這兩個變量。

每個partial都有一個和partial名字相同（不帶下劃線）的局部變量，可以通過:object選項給這個變量傳遞值：

Ruby代碼

<%= render :partial => "customer", :object => @new_customer %>

這樣就可以在_customer.html.erb中訪問customer這個變量，它指向@new_customer。

當然，作為父模板（parent）的一部分，partial可以直接訪問父模板的實例變量，例如這里的@new_customer，但是如果這么做的話，partial就跟父模板耦合了，變得不容易重用了。所以建議使用partial的名字來引用實例變量而不是直接訪問實例變量。
之前版本的Rails中，如果不指定:object或者:locals選項，rails會自動在父模板中尋找與partial同名的那個實例變量作為partial的局部變量，如：

Ruby代碼

<%= render :partial => "customer" %>

如果在_customer.html.erb中訪問customer這個變量，rails將會自動在父模板中尋找名為@customer的實例變量。這個特性在Rails2.2中已經不建議使用了（deprecated）。Rails3.0中已經將這個特性移除了。

如果要傳遞給partial的實例變量名==partial名==model名，可以簡寫，如：

Ruby代碼

#當@customer為Customer這個model的實例，并且partial名為customer時
<%= render :partial => @customer %>
#相當于
<%= render :partial => "customer", :object=>@customer %>

渲染集合（Collections）
:collection選項用于指定被傳遞給partial的集合對象，假設有books這么個集合，包含了5個Book對象，可以這樣使用：

Ruby代碼

#main.html.erb
<%= render :partial => "book", :collection => books %>
#_book.html.erb
<%= book.name%>

這樣，在main.html.erb中，_book.html.erb的內容會被渲染5次。這時候，partial模板中，與partial同名的那個變量指向了:collection選項傳過來的集合中的每一項。如果你不想使用這個與partial同名的變量名，可以通過:as選項來設置你想要的變量名（:as的值只能用symbol，不能是string，否則在partial里會得到nil值）：

Ruby代碼

<%= render :partial => "product", :collection => @products, :as => :item %>

在設置:collection選項的時候，rails同時提供了一個counter變量給partial模板，變量名以partial名（不帶下劃線）開頭，以_counter結尾，并且經試驗，這個變量名不受:as選項影響（也就是說在上面的代碼中，這個變量名應該是product_counter而不是item_counter）。其值為collection對象的索引值（從0開始）。
:spacer_template選項用于指定填充于collection每個member之間的模板：

Ruby代碼