Tag 标签

基础用法

标签 标签 标签 标签 标签

查看代码

<template>
  <e-space>
    <e-tag>标签</e-tag>
    <e-tag type="success">标签</e-tag>
    <e-tag type="info">标签</e-tag>
    <e-tag type="warning">标签</e-tag>
    <e-tag type="danger">标签</e-tag>
  </e-space>
</template>

可关闭

标签 标签 标签 标签 标签

查看代码

<template>
  <e-space>
    <e-tag v-for="key in tags" :type="key" closable @close="handleClose(key)">标签</e-tag>
  </e-space>
</template>

<script setup lang="ts">
import { ref } from 'vue'
import type { StatusType } from 'elin-ui'

const tags = ref<StatusType[]>(['primary', 'success', 'info', 'warning', 'danger'])

const handleClose = (key) => {
  tags.value = tags.value.filter((item) => item !== key)
}
</script>