折叠面板

垂直堆叠的一组交互式标题，每个标题可展开显示对应内容区域。

Component Source API Reference

Yes. It adheres to the WAI-ARIA design pattern.

安装 ​

pnpm dlx shadcn-vue@latest add accordion

用法 ​

vue
<script setup lang="ts">
import { Accordion, AccordionContent, AccordionItem, AccordionTrigger } from '@/components/ui/accordion'
</script>

<template>
  <Accordion type="single" collapsible>
    <AccordionItem value="item-1">
      <AccordionTrigger>是否支持无障碍访问？</AccordionTrigger>
      <AccordionContent>
        是的。它遵循 WAI-ARIA 设计模式。
      </AccordionContent>
    </AccordionItem>
  </Accordion>
</template>
Edit this page on GitHub