使用 Liquid 自定义标签输出多个 `span` 元素`答案

【问题标题】：Using Liquid custom tags to output multiple `span` elements`使用 Liquid 自定义标签输出多个 `span` 元素`
【发布时间】：2020-03-19 22:08:02
【问题描述】：

我正在使用 Jekyll 插件及其创建自定义标签的能力，我遇到了扩展我的标签以接受逗号分隔列表的问题。

我从以下开始：

{% symbol R %}

以及匹配的插件代码：

module Jekyll
  class Symbol < Liquid::Tag
    def initialize(tag_name, text, tokens)
      super
      @text = text
    end 

    def render(context)
      "<span class='symbol-#{@text}'>#{@text}</span>"
    end
  end
end

Liquid::Template.register_tag('symbol', Jekyll::Symbol)

正如预期的那样，我页面上的输出是：

<span class="symbol-R">R</span>

我现在要做的是修改这个插件，这样我就可以传入一个逗号分隔的列表，例如：

{% symbol R,G %}

我将我的插件代码更新为：

module Jekyll
  class Symbol < Liquid::Tag
    def initialize(tag_name, text, tokens)
      super
      @text = text
    end 

    def render(context)
      symbol = @text.split(',').map(&:strip)

      symbol.each do |item|
        puts item # to test in terminal
        "<span class='symbol-#{@text}'>#{@text}</span>"
      end
    end
  end
end

Liquid::Template.register_tag('symbol', Jekyll::Symbol)

终端输出正确：

R
G

我的期望是我的页面上会显示以下内容：

<span class="symbol-R">R</span><span class="symbol-G">G</span>

但页面上显示的只有：

RG

我可以得到一些帮助来解决这个问题吗？我觉得我非常接近......这只是我明显搞砸的实际页面渲染。

【问题讨论】：

标签： ruby jekyll liquid

【解决方案1】：

在 Ruby 中，您的函数将返回它执行的最后一个表达式。对你来说，这是symbol.each do … end。

each 返回各种东西，但它自己不做的是返回其块的内容。为此，您需要map：

symbol.map do |item|
  puts item # to test in terminal
  "<span class='symbol-#{@text}'>#{@text}</span>"
end

【讨论】：

【解决方案2】：

替换

symbol.each do |item|
  puts item # to test in terminal
  "<span class='symbol-#{@text}'>#{@text}</span>"
end

通过

output = ""
symbol.each do |item|
  output =+ "<span class='symbol-#{item}'>#{item}</span>"
end

output

【讨论】：