3

質問は確かにすでに尋ねられていますが、見つかりませんでした。

ビューで次のようなコードを書くことを余儀なくされることがよくあります。

  • <div class="<%= c ? 'my_class' : 'my_other_class' %>">
  • <div class="<%= 'my class' if c %>">
  • <div<%= c ? 'class="my_class"' : 'id="my_div"' %>>

または(よりきれいな方法ですが、読みにくくなります):

<% div_inner = capture do %>
   ...
<% end %>

<% if c %>
  <div class="my_class"><%= div_inner %></div>
<% else %>
  <div><%= div_inner %></div>
<% end %>

最後のもの:

<% div_inner = capture do %>
   ...
<% end %>

<%= content_tag(:div, div_inner, (c ? { :class => "my_class" } : {})) %>

このソリューションはすべて構文的に汚いことがわかりました。もっといい方法があると確信しています。でも魔女?ご自身の体験談大歓迎です。

4

3 に答える 3

4

もっと良い方法があると仮定するのは正しいです。条件付きロジックをビューに入れることは、MVC の精神に反します。あなたの例に基づいて、Web で読むことができるより複雑な実装ではなく、単純なヘルパー メソッドを使用しても問題ありません。

次のようなヘルパー メソッドを作成できます。

def conditional_div(condition, true_class, false_class)
  content_tag :div, class: (condition ? true_class : false_class) do
    yield if block_given?
  end
end

次に、ビューで次のように新しいヘルパーを使用できます

<%= conditional_div(c, 'my_class', '') do %>
  <p>Your content</p>
<% end %>
于 2013-03-15T13:43:54.763 に答える
1

content_tag :divコードの保守が難しくなり、追跡が非常に難しくなるため、私はあまり好きではありません。パーシャル、ヘルパー、および JavaScript の間で、クラスが要素にどのように割り当てられたかを見つけるのに 1 時間かかる場合があります。

とにかく、 <div class="<%= c ? 'my_class' : 'my_other_class' %>"> 私は通常、クラス名をオブジェクトのプロパティとして構築しようとします。たとえば、アクティブまたはキャンセルされているオブジェクトに応じて、ラベルが異なるクラスを取得するとします。

次に、私のdivは次のようになります

<div class="first-class <%= record.state %>">.....</div>

次に、私の CSS には.active{}, と の.cancelled{}定義があります。すべての erb タグが取り除かれるわけではありませんが、確実にシンプルになります。変な CSS クラス名になってしまうこともありますが、面倒な erb コードよりも扱いやすいと思います。

これも、

<div<%= c ? 'class="my_class"' : 'id="my_div"' %>>

私には間違っているように見えます。id と class は意味的に異なるものであり、このように混同してはなりません。これはデバッグが非常に困難になります。

于 2013-03-15T15:05:41.170 に答える
0

あなたがしていることに応じて、条件cがある程度「グローバル」である場合(現在のページの名前、言語、ユーザーが現在ログインしているかどうか、朝か夕方かなど)、それは作ることができますこれらをbody要素の CSS クラスとして設定すると、出力は次のようになります。

<body class="is_home_page lang_en is_logged_in">

残りは CSS で行います。

body.is_home_page .classname { color: red }
body.is_sub_page .classname { color: green }

これにより、HTML 全体が読みやすくなります。

于 2013-03-15T13:35:29.463 に答える