通过集合模式使用 Zod 定义 Astro 作品集图片库

问题描述 投票:0回答:1

我正在使用 Astro 创建一个作品集,每个项目都是一个遵循相同模式的 JSON 文件。如何将每个 JSON 文件中的

galleryImages
键定义为集合架构?

示例项目 JSON:

{
  "start": "September 2022",
  "galleryImages": [
    {
      "image": "images/web0.png"
    },
    {
      "image": "images/web1.png"
    }
  ],
  "subtitle": "iOS & Web Development",
  "title": "Yelp Shops",
  "project": "yelp",
  "icons": {
    "fa": [
      "FaReact",
      "FaSwift",
      "FaPython",
      "FaNode",
      "FaBootstrap",
      "FaGithub"
    ],
    "di": [
      "DiSwift"
    ]
  },
  "link": "https://next-yelp-shops.wl.r.appspot.com/",
  "end": {
    "date": "December 2022"
  },
  "image": "images/web0.png",
  "description": "Find the best restaurants near you! This iOS app and website fetches business data from Yelp, autodetects location using an IPInfo API, and provides address search via Google's geocoding API. Challenges during development were learning Swift, SwiftUI, and Google Cloud's App Engine and Cloud Functions. My favorite features to develop were realtime search suggestions, interface design, and developing the API with Python."
}

我理解“image”键可以这样定义:

const project = defineCollection({
    type: 'data',
    schema: ({ image }) =>
        z.object({
            ...
            image: image(),
            ...
        }),
})

我应该如何将

galleryImages
定义为模式?我还没有找到任何内容集合从目录导入图像列表的示例。

schema zod astro astrojs
1个回答
0
投票

这应该有效:

const project = defineCollection({
    type: 'data',
    schema: ({ image }) =>
        z.object({
            ...
            galleryImages: z.array(z.object({ image: image() })),
            ...
        }),
})

对于其余字段,您可以使用https://transform.tools/json-to-zod

© www.soinside.com 2019 - 2024. All rights reserved.