110 將帖子作者與作者簡介聯系起來

Question

我正在一個基本上有帖子的網站上工作，這些帖子有標簽，還有作者。 每個帖子只會有一個作者。

我的博客和標簽都按預期工作，我遇到的一個絆腳石是將我的 Frontmatter 中的作者密鑰與他們在貢獻者.json 中的生物聯系起來。 最終這將使用 Netlify CMS，因此會有一個“添加新作者”表單，然后當管理員創建新帖子時，他們可以選擇作者（有些作者將無權訪問，他們將是訪客貢獻者，只是email 的帖子結束了）。

我可以訪問我的測試作者的兩個頁面並分配正確的帖子，但在作者循環中我無法訪問相關數據。

無論如何，我的 authors.njk 前線：

layout: base.njk
permalink: /authors/{{ author | slugify }}/
pagination:
  data: collections.authorList
  size: 1
  alias: author
  filter:
  - all
  - nav
  - post
  - posts
  - tagList
eleventyComputed:
  title: Posts written by {{ author }}
  summary: "All posts written by “{{ author }}”"

理想情況下，我需要訪問前面的數據，所以我可以在頁面標題等中使用他們的實際名稱，而不是鍵。

測試帖子的 Frontmatter：

title: "The fourteenth post"
summary: "A super useful post about something or other"
date: 2022-09-15
authors:
  - jbloggs
tags:
  - Android
  - iOS
  - MacOS
  - Windows

在上面，我的密鑰是“jbloggs”，然后我有一個全局 JSON 文件，如下所示：

[
  {
    "key": "jbloggs",
    "name": "Joe Bloggs",
    ...    
    "img": {
      "url": "/test.jpeg",
      "alt": "Profile picture of Joe Bloggs"
    }
  },
...
]

在authors.njk中，我有一個卡片組件，它有一個標題、標簽作者等，我正確地顯示了jbloggs的所有帖子（我發現我必須在postAuthor變量上使用set並轉換為JSON，因為某種原因它是一個 JS object：

{% set postAuthor = null %}
{% for contributor in contributors %}
{% set postAuthor = contributor | toJson %}
  {% if post.data.author == postAuthor.key %}
    {%- set postAuthor = contributor[0] %}
  {%- endif %}
{%- endfor %}

<h2>Showing {{ collections.authorList[author].length }} posts</h2>
<ul class="cards">
  {%- for post in collections.authorList[author] | reverse -%}
    <li class="card__item">
      <article>
        <h3 class="card__title"><a href="{{ post.url }}" class="card__link">{{ post.data.title }}</a></h3>
        ...
          <span class="card__author-name">
            <a href="/authors/{{ postAuthor.key }}" class="card__author-link">{{ postAuthor.name }}</a>
        ...
      </article>
    </li>
  {%- endfor %}
</ul>

最后，.eleventy.js 文件創建了一個作者集合，我嘗試使用與標簽相同的功能，但它不會顯示帖子，並且一些谷歌搜索讓我以這種方式創建一個集合，這很好，如果我沒有相關數據。

function filterTagList(tags) {
    return (tags || []).filter(tag => ["posts", "posts"].indexOf(tag) === -1);
  }

  eleventyConfig.addFilter("filterTagList", filterTagList)

  eleventyConfig.addCollection("tagList", function(collection) {
    let tagSet = new Set();
    collection.getAll().forEach(item => {
      (item.data.tags || []).forEach(tag => tagSet.add(tag));
    });

    return filterTagList([...tagSet].sort((a, b) => a.localeCompare(b, undefined, {sensitivity: 'base'})));
  });

eleventyConfig.addCollection('authorList', collection => {
    let authorSet = {};
    collection.getAll().forEach(item => {
        if (!item.data.authors) return;
        item.data.authors.filter(
          author => !['posts', 'all'].includes(author)
        ).forEach(
          author => {
                if (!authorSet[author]) { authorSet[author] = []; }
                authorSet[author].push(item)
            }
        );
    });
    return authorSet;
});

我認為正在發生的事情是，authors.njk 文件中的循環將我的 JSON 轉換為 js object，當它從配置中獲取集合時。 好像我使用 {{ author.name }}，我得到 [object Object] 因此我最終嘗試設置為一個新變量。 我正處於嘗試各種無濟於事的階段，因此我對新變量進行了荒謬的嘗試，所以我知道我將以一種完整的菜鳥類型的方式來解決這個問題。

我需要做的是：

1. 可以訪問 Frontmatter 中的相關 JSON，所以我可以有一個頁面標題，即人員全名，而不是我在 Frontmatter 中設置的“鍵”
2. 查詢 Frontmatter 密鑰是否與 JSON 密鑰匹配，以便我可以訪問該數據，以在頁面頂部創建作者簡介，並在明信片上正確生成作者/作者 url

但是可能有更好的方法可以做到這一點，我沒有看到，所以任何幫助將不勝感激。

謝謝

Answer 1

我設法通過谷歌搜索解決了它。 我在 my.eleventy.js 文件中使事情變得過於復雜， 但是感謝撰寫此博客的小伙子，我能夠重構所有內容並使其按我想要的方式工作。