Badge

Secondary

Destructive

Outline

Verified

8

99

20+

Instalasi

npx shadcn-vue@latest add badge

Penggunaan

<script setup lang="ts">
import { Badge } from '@/components/ui/badge'
</script>

<template>
  <Badge variant="default | outline | secondary | destructive">
    Badge
  </Badge>
</template>

Link

Pakai prop as-child untuk membuat komponen lain tampil seperti badge. Berikut contoh tautan yang tampil seperti badge.

<script setup lang="ts">
import { Badge } from '@/components/ui/badge'
</script>

<template>
  <Badge as-child>
    <a href="#">Badge</a>
  </Badge>
</template>