Tag 标签
标签用于标记和选择,用来标记事物的属性和维度,以进行分类或标记。
基础用法
基础的标签用法,可以通过type属性设置不同的标签类型。
标签的 type 属性支持 primary、success、warning、error 等类型。
默认标签
主要标签
成功标签
警告标签
错误标签
可移除标签
设置 closable 属性可以定义一个标签是否可移除。
点击标签的关闭按钮可以将其移除。
标签一
标签二
+ 添加标签
不同尺寸
标签组件提供了不同的尺寸选择。
通过设置 size 属性可以使用不同尺寸的标签,支持 small、medium、large 三种尺寸。
小尺寸:
小标签
小标签
小标签
中等尺寸:
默认标签
默认标签
默认标签
大尺寸:
大标签
大标签
大标签
主题
标签组件提供了不同的主题。
通过设置 effect 属性可以使用不同主题的标签,支持 light、dark、plain 三种主题。
Light 主题:
标签
标签
标签
标签
标签
Dark 主题:
标签
标签
标签
标签
标签
Plain 主题:
标签
标签
标签
标签
标签
圆角设置
可以设置标签是否为圆角样式。
通过设置 round 属性为 false 可以使标签变为方形。
圆角标签(默认):
圆角标签
圆角标签
圆角标签
方形标签:
方形标签
方形标签
方形标签
Tag 属性
| 属性名 | 说明 | 类型 | 可选值 | 默认值 |
|---|---|---|---|---|
| type | 标签类型 | String | primary/success/warning/error | primary |
| closable | 是否可关闭 | Boolean | true/false | false |
| size | 标签尺寸 | String | small/medium/large | medium |
| text-color | 标签字体颜色 | String | — | — |
| bg-color | 标签背景颜色 | String | — | — |
| effect | 标签主题 | String | light/dark/plain | light |
| round | 是否为圆角标签 | Boolean | true/false | true |
Tag 事件
| 事件名 | 说明 | 回调参数 |
|---|---|---|
| close | 关闭标签时触发 | event |