我需要一些帮助来设置特色图像前言参数。 我已经尝试了几个小时来解决这个问题，但似乎无法弄清楚。
---
title: My post
date: 2020-02-23
published: true
thumb: '/assets/img/img.jpg'
tags:
- Tag 1
- Tag2
---
这是我的降价代码。 我试图在我的帖子页面上做的是显示特色图像，但是当代码呈现图像时，图像的 src 显示为(未知)。我用来生成这个的代码是post.data.thumb.
<img src="{{ post.data.thumb }}" alt="Some alt text">
我一直在浏览 11ty 入门博客的一些存储库，其中一些有很多自定义前言，但我在他们的任何文件中都看不到它被配置为工作的地方。
我试过使用似乎不起作用的eleventyComputed。我还尝试在我的帖子文件夹中使用 posts.11tydata.js 文件，该文件也没有做任何事情。我怀疑这可能是一件容易的事情，但我花了几个小时看它，在这一点上我完全迷失了。
module.exports = {
layout: 'post',
title: 'Untitled',
eleventyComputed: {
permalink: (data) => `${data.page.fileSlug}/index.html`,
thumb: (data) => {
if (data.thumb) {
if (data.thumb.search(/^https?:///) !== -1) {
return data.thumb;
}
return `/assets/img/${data.thumb}`;
} else {
return false;
}
}
} };
这是我想要实现的目标的一个工作示例，但我无法弄清楚为什么他们的有效而我的无效。
这是我在github上的项目的链接，如果你想仔细看看
任何帮助不胜感激！
在您提供的示例中，他们有一个帖子集合作为 Markdown 文件，其中每个帖子 (.md) 文件都有一个在前言中定义的thumb字段，表示图像缩略图名称。"posts"集合中的每个帖子都使用 post.njk 布局，这就是每个帖子的前言数据将被利用的地方：
{% if thumb %}
<div class="mt-10 -mx-7 md:mx-0">
<img class="w-full max-w-2xl mx-auto" src="{{ thumb | url }}" width="960" height="500" alt="This post thumbnail">
</div>
{% endif %}
它们(您链接的示例存储库)使用 JavaScript 数据文件将"/assets/img/"附加到thumb值，然后通过 posts.11tydata 以"/assets/img/${data.thumb}"结尾.js以在布局post.njk文件中使用。这有效，但对于简单地在父布局中使用前置数据来说有点复杂。
我会推荐以下内容：
- 将前言中的
thumb字段定义为要传递给post.liquid或.njk布局文件的每个 Markdown/Liquid 模板的图像名称。
post-one.md
---
title: Post One
date: 2020-02-23
layout: post.liquid
published: true
thumb: foo.jpg
tags:
- tag1
---
{{ thumb }} is foo.jpg
post-two.md
---
title: Post One
date: 2020-02-23
layout: post.liquid
published: true
thumb: bar.jpg
tags:
- tag1
---
{{ thumb }} is bar.jpg
- 在您的"帖子"正在使用的布局中，即
src/_includes/layouts/post.liquid，将"/assets/img/"附加到图像的src，然后简单地利用每个帖子模板中的thumb，而不是在数据文件中引入额外的逻辑。
<!-- layouts/post.liquid -->
<html>
<body>
<div class="featured-img-container">
<img src="/assets/img/{{ thumb }}" alt="Some alt text">
</div>
</body>
</html>