安裝
Terminal
pnpm dlx shadcn-vue add @admin/dividerimport { AdminDivider } from '@/components/admin/divider'用法
<script setup lang="ts">import { AdminDivider } from '@/components/admin/divider'</script><template> <div class="w-full max-w-xs"> <p class="typo-content-medium">Above</p> <admin-divider /> <p class="typo-content-medium">Below</p> </div></template>場景
垂直分隔線
<script setup lang="ts">import { AdminDivider } from '@/components/admin/divider'</script><template> <div class="flex h-10 items-center gap-4"> <span class="typo-content-medium">編輯</span> <admin-divider orientation="vertical" /> <span class="typo-content-medium">複製</span> <admin-divider orientation="vertical" /> <span class="typo-content-medium">刪除</span> </div></template>API 參考
組成
<template> <admin-divider /></template>admin-divider
Props
| 名稱 | 型別 | 預設值 | 說明 |
|---|---|---|---|
orientation | DataOrientation | undefined | "horizontal" | Orientation of the component. Either `vertical` or `horizontal`. Defaults to `horizontal`. |
decorative | boolean | undefined | true | Whether or not the component is purely decorative. When `true`, accessibility-related attributes are updated so that that the rendered element is removed from the accessibility tree. |
asChild | boolean | undefined | — | Change the default rendered element for the one passed as a child, merging their props and behavior. Read our [Composition](https://www.reka-ui.com/docs/guides/composition) guide for more details. |
as | globalThis.Component | AsTag | undefined | "div" | The element or component this component should render as. Can be overwritten by `asChild`. |
class | ClassValue | — | 根元素之自訂 class |
更新紀錄
此元件尚無更新紀錄。