如何解决Eleventy,Nunjucks和短代码性能/语法可用于任意多个项目
我正在创建一个Eleventy短代码(主要用于markdown中),该代码接受任意数量的参数,然后在将所有内容吐出之前对它们应用格式。它隐约看起来像这样:
eleventyConfig.addShortcode("theShortcode",function(...args) {
let list = '';
args.forEach( function( listItem) {
list += '<li>' + listItem + '</li>';
});
return list;
});
然后对任意数量的项目执行以下操作:
{% theShortcode "item1" "item2" "item3" %}
因此,我不认为这是生成此内容的最用户友好的方法。至少在一般情况下,我怀疑项目列表会很长,并且在编辑器中变得难以阅读。有没有更聪明的方法可以达到相同的结果,或者我可以在这里使用更好的语法?
解决方法
如果您所有的简码只是创建一个列表,为什么不只用普通的markdown来写呢?毕竟Markdown拥有syntax for ordered and unordered lists:
- 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,则可以改用paired shortcode。它可以执行与常规简码相同的操作,但是成对的简码可让您在开始标记和结束标记之间写入纯内容,这更易于阅读。例如,以下是您的列表简码作为配对的简码:
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 %}
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。