我应该如何处理包含 ruby 和 CSS 的重复使用的代码块?

What should I do with a repeatedly used chunk of code that includes ruby & CSS?

我在rails上忽略了ruby的DRY原则已经很久了。我在不同的视图文件中一遍又一遍地使用相同的代码块:

<div class="challenge-accomplished-date-banner">
  <% if @correct_user %>
    <%= challenge.notes.count.to_s.rjust(2, "0") %>
  <% else %>
    <%= challenge.notes.publish.count.to_s.rjust(2, "0") %>
  <% end %>
</div>
<% if challenge.categorization == "adventure" %>
  <%= link_to categorization_path(categorization: :adventure) do %>
    <span class="glyphicon glyphicon-picture", id="challenge-flag"></span>
  <% end %>
<% elsif challenge.categorization == "health" %>
  <%= link_to categorization_path(categorization: :health) do %>   
    <span class="glyphicon glyphicon-heart", id="challenge-flag"></span>
  <% end %>            
<% elsif challenge.categorization == "work" %>
  <%= link_to categorization_path(categorization: :work) do %>    
    <span class="glyphicon glyphicon-briefcase", id="challenge-flag"></span>
  <% end %>
<% elsif challenge.categorization == "gift" %>
  <%= link_to categorization_path(categorization: :gift) do %>    
    <span class="glyphicon glyphicon-tree-deciduous", id="challenge-flag"></span>
  <% end %>
<% else %>
  <%= link_to categorization_path(categorization: :wacky) do %>    
    <span class="glyphicon glyphicon-glass", id="challenge-flag"></span>
  <% end %>
<% end %>
<% if challenge.duels.present? && challenge.duels.last.duelers.order(id: :asc).last.accept =! false %>
  <span class="glyphicon glyphicon-tower", id="challenge-flag"></span>
<% elsif challenge.conceal == true %>
  <span class="glyphicon glyphicon-eye-close", id="challenge-flag"></span>
<% else %>
  <span class="glyphicon glyphicon-eye-open", id="challenge-flag"></span>      
<% end %>

不确定如何处理它?我把它放在...

module ApplicationHelper
  def banner
    # See Above Code Chunk
  end
end

但是它不适用于 CSS?有没有办法在助手中允许 CSS ?或者我是否将这段代码放在模型中的其他地方,但后来我 运行 陷入了同样的 CSS 问题?谢谢!

您可以在助手上定义以下方法:

def challenge_link(category)
  icon = case category
  when 'adventure' then 'picture'
  when 'health' then 'heart'
  when 'work' then 'briefcase'
  when 'gift' then 'tree-deciduous'
  else
    'glass'
  end

  link_to(categorization_path(categorization: category.to_sym)) do
    content_tag(:span, "", class: "glyphicon glyphicon-#{ icon }", id: "challenge-flag")
  end
end

然后像这样从视图中调用它:

<%= challenge_link('adventure') %>

关于 css,只需确保 challenge-accomplished-date-banner class 足够通用,以便您可以在应用的多个区域重复使用它。

如果你想走得更远,你可以考虑在控制器上的 before_action 上定义 @challenge_notes@challenge_flag,并在你的视图中使用以下代码:

<div class="challenge-accomplished-date-banner">
  <%= @challenge_notes %>
</div>

<%= challenge_link('adventure') %>

<span class="glyphicon glyphicon-<%= @challenge_icon %>", id="challenge-flag"></span>

创建一个CATEGORIES常量

CATEGORIES = {
  adventure: 'glyphicon-picture',
  health:    'glyphicon-heart',
  work:      'glyphicon-briefcase',
  gift:      'glyphicon-tree-deciduous'
}

CATEGORIES.default = 'glyphicon-glass'

创建部分

_flag.html.erb

<span class="glyphicon <%= class_name %>", id="challenge-flag"></span>

_link.html.erb

<%= link_to categorization_path(categorization: category) do %>    
  <%= render 'flag', class_name: class_name %>
<% end %>

并使用它们

<% category = challenge.categorization %>
<% class_name = CATEGORIES[category.to_sym] %>

<%= render 'link', class_name: class_name, category: category %>