我试图使用Nuxt内容来创建我的网站的博客部分.我已经创建了目录结构和一些测试职位.我还创建了抓取职位的查询，并将其存储为引用，以便他们可以在页面上使用.我的问题是，我在页面上看到的组件不匹配什么是由Nuxt内容查询返回
片段

<script setup> 
const { data: recentBlogPosts } = await useAsyncData(`content-${path}`, () => {
  return queryContent()
    .only(['title', 'excerpt', 'created', 'updated', 'slug', 'tags', '_id'])
    .limit(5)
    .sort({ 'updated': -1 })
    .find()
})

index.vue页面片段

<nuxt-link v-for="post in recentBlogPosts" :key="post._id" :to="`blog/${post.slug}`">
  <BlogPostShort class="blog-post-short"
    :title="post.title"
    :createdDate="post.created"
    :updatedDate="post.updated"
    :excerpt="post.excerpt"
    :tags="post.tags" />
</nuxt-link>

在页面上生成的网站输出

Vue DevTools的图像仅显示由v-for指令生成的5个组件

我试过在代码中添加一个:key="post._id"，但这并没有解决任何问题。我以为给Nuxt一种将帖子绑定到后端数据的方法可能会有所帮助，但遗憾的是没有这样的运气

EDIT通过mustache-syntax添加recentBlogPosts变量的图像添加到页面（不允许内联它，因为我是一个低代表新手）：

https://i.stack.imgur.com/PBAJM.png