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>
أنا لا أحب النهج الأول لأنه مزدحم يبحث ويصعب قراءتها. لا أحب الطريقة الثانية لأن التعشيش مشدود. سيكون من الجيد وضعه في النموذج ، (شيء مثل @status.css_class) ، لكن هذا لا ينتمي إلى هناك. ماذا يفعل معظم الناس؟
يمكنني استخدام الطريقة الأولى ، ولكن مع بناء جملة أكثر إيجازًا قليلاً:
<div class="<%= 'ok' if @status == 'success' %>">
على الرغم من أنه عادة ما يجب أن تمثل النجاح في المعرف المنطقي true أو معرف سجل رقمي ، والفشل مع المعرف المنطقي false أو nil. بهذه الطريقة يمكنك فقط اختبار المتغير الخاص بك:
<div class="<%= 'ok' if @success %>">
نموذج ثانٍ باستخدام عامل التشغيل ?: الثلاثي ، مفيد إذا كنت تريد الاختيار بين فئتين:
<div class="<%= @success ? 'good' : 'bad' %>">
أخيرًا ، يمكنك استخدام مساعدين لعلامات سجل Rail مثل div_for ، والتي ستقوم تلقائيًا بتعيين المعرف والفئة وفقًا للسجل الذي قدمته. إعطاء Person بالكود 47:
# <div id="person_47" class="person good">
<% div_for @person, class: (@success ? 'good' : 'bad') do %>
<% end %>
تجنب المنطق في وجهات النظر
تكمن المشكلة في الطريقة القياسية في أنها تتطلب منطقًا في شكل عبارات if أو ثلاثية في طريقة العرض. إذا كان لديك العديد من فئات CSS الشرطية مختلطة مع الفئات الافتراضية ، فأنت بحاجة إلى وضع هذا المنطق في علامة استيفاء سلسلة أو علامة ERB.
إليك طريقة محدثة تتجنب وضع أي منطق في المشاهدات:
<div class="<%= class_string(ok: @success) %>">
some message here
</div>
طريقة class_string
يأخذ المساعد class_string تجزئة مع أزواج المفتاح/القيمة التي تتكون من سلاسل اسم فئة CSS و القيم المنطقية . نتيجة الطريقة عبارة عن سلسلة من الفئات التي يتم فيها تقييم القيمة المنطقية إلى صواب.
استخدام عينة
class_names(foo: true, bar: false, baz: some_truthy_variable)
# => "foo baz"
حالات الاستخدام الأخرى
يمكن استخدام هذا المساعد ضمن علامات ERB أو مع مساعدين Rails مثل link_to.
<div class="<%= class_string(ok: @success) %>">
some message here
</div>
<% div_for @person, class: class_string(ok: @success) do %>
<% end %>
<% link_to "Hello", root_path, class: class_string(ok: @success) do %>
<% end %>
إما/أو فصول
بالنسبة لحالات الاستخدام التي يكون فيها الثلاثية ضرورية (على سبيل المثال ، @success ? 'good' : 'bad') ، مرر صفيفًا حيث يكون العنصر الأول هو فئة true والآخر لـ false
<div class="<%= [:good, :bad] => @success %>">
مستوحاة من رد الفعل
هذه التقنية مستوحاة من وظيفة إضافية تسمى classNames (المعروفة سابقًا باسم classSet) من إطار الواجهة الأمامية React الخاص بـ Facebook.
باستخدام في مشاريع القضبان الخاصة بك
اعتبارًا من الآن ، لا توجد وظيفة class_names في Rails ، لكن توضح لك هذه المقالة كيفية إضافتها أو تنفيذها في مشاريعك.
يمكنك أيضًا استخدام content_for المساعد ، خاصةً إذا كان DOM موجودًا في تخطيط وتريد تعيين فئة css اعتمادًا على التحميل الجزئي.
على التصميم:
%div{class: content_for?(:css_class) ? yield(:css_class) : ''}
على الجزئي:
- content_for :css_class do
my_specific_class
هذا هو.