文章来源于网络收集而来，版权归原创者所有，如有侵权请及时联系！

Crystallize 与 Astro

发布于 2024-06-05 21:19:56 字数 14103 浏览 0 评论 0 收藏 0

Crystallize 是一个面向电子商务的 headless 内容管理系统，提供 GraphQL API 接口。

示例

src/pages/index.astro

---
// 从 Crystallize 的 GraphQL API 获取目录路径


import BaseLayout from '../../layouts/BaseLayout.astro';
import { createClient } from '@crystallize/js-api-client';


const apiClient = createClient({
  tenantIdentifier: 'furniture'
});


const query = `
  query getCataloguePaths{
    catalogue(language: "en", path: "/shop") {
      name
      children {
        name
        path
      }
    }
  }
`
const { data: { catalogue } } = await apiClient.catalogueApi(query)
---
<BaseLayout>
  <h1>{catalogue.name}</h1>
  <nav>
    <ul>
      {catalogue.children.map(child => (
        <li><a href={child.path}>{child.name}</a></li>
      ))}
    </ul>
  </nav>
</BaseLayout>