Блог

Я получил СУХОЙ вопрос по стилизации в Ruby on Rails (5.2).

1. Чего я хочу достичь

Итак, я создаю раздел формы для продажи дома, и я получил следующее:

Но я смотрю на свой код и, честно говоря, это ужасно!

           <%= form.fields_for :rules do |rules_form| %>
                    <div class="col l4 m2 s4">
                        <label>
                            <div class="input-field">
                                <i class="material-icons-two-tone">pets</i>
                                <%= rules_form.check_box(:pets_allowed, {}) %>
                                <span for="pets_allowed">Pets Allowed</span>
                            </div>
                        </label>
                    </div>

                    <div class="col l4 m2 s4">
                        <label>
                            <div class="input-field">
                                <i class="material-icons-two-tone">smoking_rooms</i>
                                <%= rules_form.check_box(:permitted_smoking, {}) %>
                                <span for="permitted_smoking">Smoking Allowed</span>
                            </div>
                        </label>
                    </div>

                    <div class="col l4 m2 s4">
                        <label>
                            <div class="input-field">
                                <i class="material-icons-two-tone">people</i>
                                <%= rules_form.check_box(:allowed_visitors, {}) %>
                                <span for="allowed_visitors">Vists Allowed</span>
                            </div>
                        </label>
                    </div>

                    and so on.....
 

2. Что я думал сделать:

Так что да, как вы можете видеть, это НЕ СУХАЯ вещь. И то, что я думал сделать, это что-то вроде этого:

    <%= form.fields_for :rules do |rules_form| %>
            <div class="col l4 m2 s4">
                <label>
                    <div class="input-field">
                        <i class="material-icons-two-tone">[dynamic icon]</i>
                        <%= rules_form.check_box([dynamic db column name], {}) %>
                        <span for="pets_allowed">[dynamic text to display]</span>
                    </div>
                </label>
            </div>
   <% end %>
 

Возможно, это не синтаксис, но вы поняли суть.

3. Что я сделал до сих пор:

Хорошо, это то, что я думал сделать, 1. в моем вспомогательном файле создайте метод, подобный этому:

 def servicesArray
        serv = ['wifi', 'gas', 'water', 'electricity', 'include_furniture', 'air_conditioning', 'business_center', 'laundry', 'television', 'guard']
        serv.each do |obj|
            puts obj
        end
    end
 

Затем, чтобы проверить это, я вызываю его в своей форме и вижу это:

Хорошо, это хорошо, но не то, что ожидалось, и поэтому мой вопрос:

Как я могу добиться такого? Каков наилучший подход к работе с динамическими классами CSS и / или атрибутами, чтобы избежать большого количества блоков кода? Что вы порекомендуете мне сделать в будущем?

Я буду очень признателен за вашу помощь в этом! Спасибо

Для этого есть несколько способов, но начнем с того, что, вероятно, самый простой:

1. Создайте помощник, который возвращает все динамические данные, необходимые для вашей формы. Глядя на ваш код, кажется, что для каждого флажка требуется 3 вещи — заголовок, имя параметра и полное имя. Итак, вы могли бы написать вспомогательный метод следующим образом:

    def services_array
     [
       { title: "pets", param_name: :pets_allowed, full_name: "Pets Allowed" },
       { title: "people", param_name: :allow_visitors, full_name: "Visits Allowed" },
       { title: "smoking_rooms", param_name: :permitted_smoking, full_name: "Smoking Allowed" }
     ]
   end
    

2. На ваш взгляд, выполните цикл по этому:

       <%= form.fields_for :rules do |rules_form| %>
        <% services_array.each do |service| %>
          <div class="col l4 m2 s4">
            <label>
              <div class="input-field">
                <i class="material-icons-two-tone"><%= service[:title] %></i>
                <%= rules_form.check_box(service[:param_name], {}) %>
                <span for="<%= service[:param_name] %>"><%= service[:full_name] %></span>
              </div>
            </label>
          </div>
        <% end %>
      <% end %>