iT邦幫忙

DAY 25
1

Ruby on Rails 花招百出系列 第 27

Rails 基本 Helper 介紹

剛開始撰寫Rails時,假如你跟我一樣看不懂一個html.erb檔案裡面有非常多看不懂的東西,也不知道helper是什麼,那你找對地方了,本篇文章簡單說明基本的helper概念,讓你看得懂helper在幹嘛。

Helper是什麼

Helper是一種輔助方法,目的是將Ruby code帶入view當中,而不是單純的平舖直敘。這點也是Rails分工的一環,model和controller的method不能在view當中直接使用,只有helper method才行。

Helper和Helper method差在哪裡?

Helper是一個概念,而在Rails架構中helper自己有一個資料夾,我們可以在裡面定義helper method,定義完以後就可以在view當中使用。Rails當中有提供很多內建的helper,只要是.erb結尾的檔案,都可以使用helper,包括html.erb、js.erb等等。

當然,helper這個詞並不會使用於controller和model當中。

<% %>和<%= %>

複習一下,在.erb結尾的檔案當中,可以利用<% %>符號將Ruby code包覆起來,在裡面執行程式碼。而加上一個等號的<%= %>會將裡面執行的結果print出來。例如:

<% i = 1 %>
<% if i == 1 %>
	<h3> i = 1 </h3>
<% end %>
# => <h3> i = 1 </h3>

<%= i %>
# => 1

在第一個例子當中,只要if情況成立,就會將h3的html標籤顯示出來,若不成立則不顯示。第二個例子則是直接將i的數值顯示出來。而helper也是要放在這個區塊裡面執行,與一般Ruby code相同。

最常見的 link_to

了解.erb是如何將Ruby code放到html文件當中以後,接下來先了解最常用的link_to helper,用法如下:

# 公式
link_to display_text, link_ref, url-options, html-options

# 常見樣貌
link_to "Home", root_url, :id => 5, :class => "root-link"

# link_to會產生以下html code
<a href="link_ref" url-options html-options >display_text</a>

link_to總共會帶有四個變數,最前面兩個必填,後面是選填。

  1. display_text: 這個連結會產生什麼文字
  2. link_ref: 要連結到哪個位置
  3. url_options: 與連結有關的內容,例如要送參數就是放在這裡
  4. html_options: 跟html前端直接相關的內容,例如給予class和id

看一個非常典型會使用的例子:

<table class="table">
	<tbody>
		<% @posts.each do |post| %> 
			<tr>
				<td> <%= post.content %> </td>
				<td> <%= link_to "Edit", edit_post_path(post) %>
				<%= link_to "Delete", post_path(post), :method => :delete %></td>
			</tr>
		<% end %>
	</tbody>
</table>

從第3行開始,依照邏輯逐步講解:

  1. 通常這種情況,在controller裡面我們都已經有指定一個@post的instance variable,可以直接在view當中使用。
  2. @post是一個陣列,所以使用**.each**這個method,讓每一個element都執行一次do..end的內容。
  3. 後面的**|post|代表在這個do...end的block當中,我們要指定post**為每一個@post當中的element的變數。
  4. 在do...end當中,首先post.content會讀取帶入的post的content屬性。
  5. 使用link_to helper進行連結,配上顯示文字Edit,以及Rails連結的路徑,以這個寫法來看就是連結到post這個class底下的edit action,並在後方指定傳送參數post到後端。
  6. 第二個delete的連結,最後帶有一個method為delete,這是發送html request時會指定的method,如果純粹是抓取資訊,就會用get,而非delete

form_for

form_for是Rails用來產生表單的helper,通常會長這樣:

<%= form_for @post do |f| %>
  <p>Title: <%= f.text_field :title %></p>
  <%= f.text_area :content %>
  <%= f.submit "Create" %>
<% end %>

form_for同樣會用do...end block包覆起來,裡面使用f變數來代表表格本身。裡面通常會包含填寫的地方如text_field和text_area,加上最後有一個submit的按鈕或連結,只要點擊就可以傳送表單。

render

在view當中,常常也會看到以下三種用法:

# 1
<%= render partial: "posts/_new" %>

# 2
<%= render template: "posts/new" %>

# 3
<%= render file: "views/posts/new.html.erb" %>

render顧名思義就是產生某些內容,而在Rails當中可以在view中利用render來產生html。以上三種方式所產生出來的內容是一樣的,但寫法和檔案命名會稍有不同。

partial代表會去尋找view當中底線_開頭的檔案,partial本身就是一個要拿來重複利用的樣板,所以讀取設計上也比較直接。

template讀取寫法使用的是”controller/action”,他所產生出來的內容就是該action對應到的template。

file基本上沒什麼好說的,就是讀取檔案,把所有html讀取出來;最直接但閱讀起來最麻煩。

延伸閱讀

Rails實戰聖經:helpers
Form Helper

CC圖片授權:OpenClipart

同步刊登於我的部落格:特快車


上一篇
Ruby及Rails當中的:symbol代表什麼意思?
下一篇
Rails 當中的 params 是什麼?
系列文
Ruby on Rails 花招百出32

尚未有邦友留言

立即登入留言