Nuxt Content V3 中按文件夹路径检索内容的实现方案

在 Nuxt Content V3 的使用过程中，开发者经常需要根据文件目录结构来检索内容。本文将深入探讨在不同场景下的实现方案，帮助开发者更好地组织和管理内容资源。

页面集合（Page Collection）的路径查询

对于定义为页面集合（page类型）的内容，可以直接使用内置的path字段进行查询：

const { data } = await useAsyncData(`albums`, () => {
  return queryCollection('albums')
    .where('path', 'LIKE', '/albums%')
    .all()
})

这种方法特别适合需要国际化支持的场景，可以配合useI18n轻松实现多语言内容检索。

数据集合（Data Collection）的替代方案

当内容被定义为数据集合（data类型）时，系统不会自动生成path等页面特有字段。此时开发者可以：

1. 在集合模式中自定义path字段：

// content.config.ts
defineCollection({
  schema: {
    path: z.string()
    // 其他字段...
  }
})

2. 在Markdown文件的frontmatter中显式声明路径：

---
path: /albums/example
---

Markdown内容的渲染处理

即使用数据集合存储内容，仍然可以实现Markdown渲染：

1. 在模式中定义body字段：

defineCollection({
  schema: {
    body: z.string()
    // 其他字段...
  }
})

2. 使用ContentRenderer组件：

<ContentRenderer :value="contentData" />

最佳实践建议

1. 如果内容需要作为独立页面访问，优先使用page类型集合
2. 对于纯数据内容，使用data类型集合并自定义必要字段
3. 多语言项目建议结合useI18n实现路径动态构建
4. 复杂查询场景可以组合使用多个.where()条件

通过合理运用这些技巧，开发者可以构建出既灵活又高效的内容管理系统，满足各种业务场景的需求。