☰

ビュー内の HTML 要素に条件付きでクラスを追加するエレガントな方法は何ですか? 質問する

tag-icon • tag-icon ruby-on-rails view
ビュー内の HTML 要素に条件付きでクラスを追加するエレガントな方法は何ですか? 質問する

時々、条件に基づいて HTML 要素にクラスを追加する必要があります。問題は、それをきれいに行う方法がわからないことです。以下は私が試したことの例です。

<div <%= if @status = 'success'; "class='ok'"; end %>>
   some message here
</div>

または

<% if @status == 'success' %>
   <div class='success'>
<% else %>
   <div>
<% end %>
   some message here
</div>

最初のアプローチは見た目が雑然としていて読みにくいので好きではありません。2 番目のアプローチはネストがおかしくなるので好きではありません。モデルに ( のような@status.css_class) 入れると良いのですが、それはそこに属していません。ほとんどの人はどうするのでしょうか?

ベストアンサー1

私は最初の方法を使用しますが、構文は少し簡潔になっています。

<div class="<%= 'ok' if @status == 'success' %>">

ただし、通常は成功をブール値trueまたは数値レコード ID で表し、失敗をブール値falseまたはで表す必要がありますnil。この方法では、変数をテストできます。

<div class="<%= 'ok' if @success %>">

三項演算子を使用する 2 番目の形式は、?:2 つのクラスから選択する場合に便利です。

<div class="<%= @success ? 'good' : 'bad' %>">

最後に、Railのレコードタグヘルパーのようにdiv_for、指定したレコードに基づいて ID とクラスが自動的に設定されます。ID Person47 の があるとします。

# <div id="person_47" class="person good">
<% div_for @person, class: (@success ? 'good' : 'bad') do %>
<% end %>

おすすめ記事