Tag 标签
用于标记和分类的标签组件。
基础用法
基础的标签用法。
标签一标签二标签三标签四标签五标签六
可关闭标签
设置 closable 属性可以定义一个标签是否可移除。
标签一标签二标签三标签四标签五标签六
不同尺寸
Tag 组件提供除了默认值以外的四种尺寸，可以在不同场景下选择合适的标签尺寸。
超小标签小型标签中等标签大型标签
不同主题
Tag 组件提供了三种不同的主题：light、dark 和 plain。
浅色主题（默认）
默认主要成功警告危险信息
深色主题
默认主要成功警告危险信息
朴素主题
默认主要成功警告危险信息
圆角标签
通过设置 round 属性，可以让标签变为圆角风格。
标签一标签二标签三标签四标签五标签六
自定义颜色
可以自定义标签的背景色和文字颜色。
自定义颜色粉红标签青色标签蓝色标签
禁用状态
通过设置 disabled 属性来禁用标签。
禁用标签禁用标签禁用标签禁用标签
动态编辑标签
动态编辑标签可以通过点击标签关闭按钮后触发的事件来实现。
标签一标签二标签三
API
Tag 属性
| 属性名 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| type | 标签类型 | string | default / primary / success / warning / danger / info | default |
| size | 标签尺寸 | string | tiny / small / medium / large | medium |
| theme | 标签主题 | string | light / dark / plain | light |
| closable | 是否可关闭 | boolean | — | false |
| disabled | 是否禁用 | boolean | — | false |
| round | 是否为圆角 | boolean | — | false |
| bordered | 是否显示边框 | boolean | — | true |
| color | 自定义背景色 | string | — | — |
| text-color | 自定义文字颜色 | string | — | — |
| custom-class | 自定义类名 | string | — | — |
| custom-style | 自定义样式 | string / object | — | — |
Tag 事件
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| click | 点击标签时触发 | (event: MouseEvent) |
| close | 关闭标签时触发 | (event: MouseEvent) |
Tag 插槽
| 插槽名 | 说明 |
|---|---|
| default | 标签内容 |