javascript - 未找到使用 slug 的 nuxt 内容链接

Question

我正在尝试 nuxt 内容模块。我在内容文件夹中创建了一个名为“articles”的目录，其中包含 2 个带有一些虚拟数据的 md 文件。然后，在页面内我有一个名为“tutorials”的文件夹，其中包含“_slug.vue”和 index.vue

索引页面只显示文章的标题，它工作正常。每个标题都使用 path/slug 链接到实际文章。问题是我找不到页面。这是我的代码：index.vue：

<template>
  <div>
    <article v-for="article of articles" :key="article.id">
      <nuxt-link :to="`/tutorials/${article.slug}`">
        {{ article.slug }}
      </nuxt-link>
    </article>
  </div>
</template>

<script>
export default {
  async asyncData({ $content, params }) {
    const articles = await $content('articles', params.slug)
      .only(['title', 'slug'])
      .sortBy('createdAt', 'asc')
      .fetch()

    return {
      articles,
    }
  },
}
</script>

_slug.vue：

<template>
  <div>
    <nuxt-content :document="article" />
  </div>
</template>

<script>
export default {
  async asyncData({ $content, params }) {
    const article = await $content('articles', params.slug).fetch()

    return {
      article,
    }
  },
}
</script>

<style></style>

谢谢你。

标签： javascriptvue.jsnuxt.js