重载组件

将 shadcn-docs-nuxt 组件替换为自定义 Vue 组件.

shadcn-docs-nuxt 是一个 Nuxt 层, 你可以通过在项目中创建一个与原组件路径相同的自定义 Vue 组件来重写 shadcn-docs-nuxt 中的任何组件. 确保你的组件包含与原组件相同的 props.

这是 shadcn-docs-nuxt 中 components/ 文件夹的简要展示.

components/
- layout/
  Header.vue
  Footer.vue
  ...
- content/
  Accordion.vue
  Alert.vue
  ProseCode.vue
  ...
- ui/
  button/
  card/
  ...

在 GitHub 查看完整的文件结构

例如，如果你想重写 Footer 组件, 请在你的项目根目录下创建 /components/layout/Footer.vue.

/components/layout/Footer.vue

<template>
  <footer class="text-muted-foreground py-6 md:px-8 md:py-0">
    <div class="container flex flex-col items-center justify-between gap-2 md:h-24 md:flex-row">
      My footer
      <span class="flex-1" />
      {{ footer.credits }}
    </div>
  </footer>
</template>

<script setup lang="ts">
const { footer } = useConfig().value;
</script>

在 GitHub 上 Star 创建一个 Issue