View Shadcn UI

Appearance

介绍 ​


本文档主要用于描述 ShadcnToolbarFooter 组件的一些特性和用法。

用法 ​

查看代码
vue
<template>
    <ShadcnToolbarFooter>
      <template #left>Basic</template>
    </ShadcnToolbarFooter>
</template>

<script setup lang="ts">
</script>

自动隐藏 (auto-hide) ​

查看代码
vue
<template>
  <ShadcnToolbarFooter auto-hide>
    <template #left>Auto Hide</template>
  </ShadcnToolbarFooter>
</template>

<script setup lang="ts">
</script>

自动隐藏延迟 (auto-hide-delay) ​

查看代码
vue
<template>
  <ShadcnToolbarFooter auto-hide auto-hide-delay="2000">
    <template #left>Auto Hide Delay</template>
  </ShadcnToolbarFooter>
</template>

<script setup lang="ts">
</script>

全宽 (full-width) ​

查看代码
vue
<template>
  <ShadcnToolbarFooter full-width>
    <template #left>Full Width</template>
  </ShadcnToolbarFooter>
</template>

<script setup lang="ts">
</script>