代码之家  ›  专栏  ›  技术社区  ›  croceldon

如何在助手中嵌套Rails标记?

  •  0
  • croceldon  · 技术社区  · 4 年前

    使用Rails 6.1,尝试在助手方法中嵌套内容:

    tag.div do
      concat tag.span 'Options: ', class: 'small'
      concat tag.span do
        doc.options.each do
          concat option.title
        end
      end
    end
    

    我希望它返回一个包含两个跨距的div,第一个包含“Options”字符串,第二个包含所有选项的标题。但这不管用。我的结局是:

    <div>
      <span class="small">Options: </span>
      <span></span>
    </div>
    

    最后一个跨度为空。我怎样才能让它工作?

    0 回复  |  直到 4 年前
        1
  •  2
  •   Cassandra S.    4 年前

    这不起作用的原因是。。。我不完全确定。他们之间发生了一些奇怪的事情 concat tag ,这是肯定的:

    :0> tag.div do
    :1*   tag.span { "A" }
    :1> end
    => "<div><span>A</span></div>"
    
    # But:
    :0>tag.div do
    :1*   tag.span { "A" }
    :1>   tag.span { "B" }
    :1> end
    => "<div><span>B</span></div>"
    
    # But also:
    :0> tag.div do
    :1*   concat tag.span { "A" }
    :1>   concat tag.span { "B" }
    :1> end
    => "<div><span></span><span></span></div>"
    
    :0> helper.tag.div do
    :1*   concat tag.span { concat "A" }
    :1>   concat tag.span { concat "B" }
    :1> end
    => "<div><span>A</span><span>B</span></div>"
    
    # For completeness:
    :0> tag.div do
    :1*   concat tag.span "A"
    :1>   concat tag.span "B"
    :1> end
    => "<div><span>A</span><span>B</span></div>"
    

    也许更精通Rails的人可以更好地解释这一点。但我可以给你一个解决方案。


    或者更确切地说,我不知道你想要实现什么,但你可以这样做:

    tag.div do
      concat tag.span "A"
      concat tag.span([1, 2, 3].join(" "))
    end
    

    那会给你 <div><span>1 2 3</span></div> .你也可以完全取消concat:

    tag.div do
      tag.span "A"
      tag.span([1, 2, 3].join(" "))
    end
    

    但如果你想要每个 title 作为自己的 span ,你做得不对:

    :0> tag.div do
    :1*   concat tag.span "A"
    :1>   ["B", "C"].each { |c| concat tag.span c }
    :1> end
    => "<div><span>A</span><span>B</span><span>C</span></div>"
    

    最后没有理由为这种静态html使用助手;最好在erb或haml文件中提供:

    <span class="small">Options</span>
    <% doc.options.each do |option| %>
      <span><%= option.title %></span>
    <% end %>