Tech Racho エンジニアの「?」を「!」に。
  • Ruby / Rails関連

Rails: 5.1以降のtagヘルパー記法はcontent_tagより便利

更新情報

  • 2018/11/01: 初版公開
  • 2022/01/13: 更新

こんにちは、hachi8833です。少し前の話ですが、Rails 5.0->5.1で変更されたビューヘルパーのtagメソッドについてメモします。

なお5.1と5.2では変化はありません。

Railsビューヘルパーのtagメソッド

きっかけはDHHによる以下のissueです。

# #25195より
# 以前は<span class="bookmark"></span>を次で生成していた
content_tag :span, nil, class: 'bookmark'
# 今後は次でできる(<span>など閉じタグが必要なタグや<br>など閉じタグ不要なタグのインデックスを保持するので) 
tag.span class: 'bookmark'

# 以前は<div id="post_1">を次で生成していた
content_tag :div, post.title, id: dom_id(post)  
# 今後は以下でできる
tag.div post.title, id: dom_id(post)

# 以前は<br>を以下で生成していた
tag :br, nil, true
# 今後は以下でできる(spanのときと同様。このタグは閉じタグ不要であることがわかっている)
tag.br

# ネストもサポートできるとよい: <div id="header"><span>hello</span></div>を以下で生成する
tag.div(id: 'header') { |tag| tag.span 'hello' }

その後#25543でマージされ、5.1に取り入れられました。Rubyらしく書けるtag.タグ名記法はデフォルトでHTML 5をサポートします。

かつ、content_tagはレガシー記法であるとされ、その記述は5.2の現在も変わっていません。ただしcontent_tagは今のところ非推奨にはなっていないようです。非推奨にするには影響が大きすぎるからだろうと思いました。

追記(2022/01/13)

content_tagはその後もRails 7まで変わらず利用できます。

その代り、tagの古い記法(tag('br')など)は#25543の時点で非推奨になっており、今後廃止の予定です。

参考: Rails 5.1 からは tag(:br) より tag.br を推奨 - Qiita

追記(2022/01/13)

tagのレガシー記法はその後も削除されておらず、Rails 7でも利用できます。

Rails 5.2.1で確認

5.2.1でrails newし、Postをscaffoldで生成し、レコードを2つ作ってから上のcontent_tag記法とtagの新しい記法をそれぞれ試してみました。

<!-- view/posts/index.html.erb -->
...
<%= content_tag :span, nil, class: 'bookmark' %>
<%= tag.span class: 'bookmark' %>

<% @posts.each do |post| %>
  <%= content_tag :div, post.title, id: dom_id(post) %>
  <%= tag.div post.title, id: dom_id(post) %>
<% end %>

<%= tag :br, nil, true %>
<%= tag.br %>

<%= tag.div(id: 'header') { |tag| tag.span 'hello' } %>
...

content_tag :spantag.spanも動きました。

ビューでtag.div tag.p('Hello world!')と書けば<div><p>Hello world!</p></div>のようにネストできたり、以下のようにdo-endブロックで文字列を渡せたりする機能もcontent_tagと同じですが、記法がシンプルなのが嬉しい点です。

<%= tag.p do %>
  パラグラフの文章
<% end %>

使い勝手やHTML 5対応を考えると、基本的にcontent_tagよりもtag.タグ名を使うのがよさそうです。

関連記事

Rails tips: ビューのcontent_tagのあまり知られていないオプション(翻訳)


CONTACT

TechRachoでは、パートナーシップをご検討いただける方からの
ご連絡をお待ちしております。ぜひお気軽にご意見・ご相談ください。