0

我正在创建一个 Eleventy 短代码(主要用于降价),它接受任意数量的参数,然后在吐出所有内容之前对它们应用格式。它模糊地看起来像这样:

  eleventyConfig.addShortcode("theShortcode", function(...args) {
    let list = '';
    args.forEach( function( listItem) {
      list += '<li>' + listItem + '</li>';
    });
    return list;
  });

然后你对任意数量的项目做这样的事情:

{% theShortcode "item1" "item2" "item3" %}

所以我不相信这是生成此内容的最用户友好的方式。至少,我怀疑在一般情况下,项目列表会很长,并且在编辑器中变得难以阅读。有没有更聪明的方法来实现相同的结果,或者我可以在这里使用更好的语法?

4

1 回答 1

1

如果您的简码所做的只是创建一个列表,那么为什么不直接用普通的降价代码编写呢?毕竟,Markdown 有有序列表和无序列表的语法:

- unordered list item 1
- unordered list item 2
- unordered list item 3

1. ordered list item 1
2. ordered list item 2
3. ordered list item 3

如果您的示例已简化,并且您实际上需要输出在普通 Markdown 中无法实现的自定义 HTML,则可以改用成对的短代码。它可以做与您的常规短代码相同的事情,但成对的短代码允许您在开始和结束标记之间写入纯内容,这更容易阅读。例如,这是您的列表短代码作为配对短代码:

eleventyConfig.addShortcode("makelist", content => {
    const items = content.split(/\r\n|\r|\n/).filter(Boolean);
    const list = items.map(item => `<li>${item}</li>`);
    return `<ul>${"\n"}${list.join("\n")}${"\n"}</ul>`;
});

您可以向函数添加更多参数并在短代码的开始标记中传递参数(例如在有序列表和无序列表之间切换)。像这样使用它:

{% makelist %}

list item 1
list item 2
list item 3

{% endmakelist %}
于 2020-11-13T09:36:02.597 回答