Tech Racho エンジニアの「?」を「!」に。
  • 開発

Rails: 5.1以降タグヘルパーの#tagの新しい記法は#content_tagより便利

こんにちは、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は今のところ非推奨にはなっていないようです。非推奨にするには影響が大きすぎるからだろうと思いました。

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

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

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>のようにネストできたり、以下のようにdoendブロックで文字列を渡せたりする機能もcontent_tagと同じですが、記法がシンプルなのが嬉しい点です。

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

使い勝手やHTML 5対応を考えると、基本的にcontent_tagよりもtag.タグ名を使うのがよさそうです。その割にはedgeguidesにもtagについて記載が見当たりませんが。

関連記事

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


CONTACT

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