Nextjs JSX 和 11ty Nunjucks 将循环与组件进行比较

问题描述

博客数据。在 11ty 中，_data 文件夹中已有 blogsData.json 文件。

[
  {
    "date": "July 15,2021","title": "Ab nihil non sequi.",...
  },{
    "date": "July 11,"title": "Lorem,ipsum.",...
]

Nextjs - React - pages/index.jsx

import BlogCard from './BlogCard'

export default function HomePage(){

  return <>
    {blogsData.map((item,index) => (
      <div key={index}>
        <BlogCard {...item} />
      </div>
    ))}
  </>
}

11ty - Nunjucks - index.njk

{% for item in blogsData %}
  <div>
    {% include 'blogCard.njk' %}
  </div>
{% endfor %}

我是 11ty 和 Nunjucks 的新手，这是我尝试过的。

但并没有真正了解如何传递像上面那样在 Next.js 中使用的道具。

是否可以在 11ty 中进行？

顺便说一下，_includes 文件夹中 blogCard.njk 中的代码如下所示。

---
??
---

<h3>
  {{ title }}
</h3>
<p>
  {{ date }}
</p>

我认为 ?? 只是传递变量的方式，但如何？

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）