标签
用于标记和选择。
基础用法
可移除标签
动态编辑标签
您可以使用 close 事件来动态地添加和删除标签。
尺寸
除了默认尺寸外,标签组件还提供了另外三种尺寸,以便您在不同的场景中进行选择。
主题
标签提供了三种不同的主题:dark、light 和 plain
圆形标签
标签也可以像按钮一样是圆角的。
可选中标签
有时因为业务需要,我们可能需要像复选框一样的标签,但是**按钮状的复选框**不能满足我们的需求,这时候就有了 check-tag。您可以在 2.5.4 版本中使用 type 属性。
Tag API
Tag 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| type | 标签的类型 | 枚举 | 主要 |
| 可关闭 | 标签是否可以移除 | boolean | false |
| disable-transitions | 是否禁用动画 | boolean | false |
| hit | 标签是否有高亮边框 | boolean | false |
| color | 标签的背景色 | string | — |
| size | 标签的尺寸 | 枚举 | — |
| effect | 标签的主题 | 枚举 | light |
| 圆角 | 标签是否为圆形 | boolean | false |
Tag 事件
| 名称 | 描述 | 类型 |
|---|---|---|
| click | 点击标签时触发 | Function |
| 关闭 | 移除标签时触发 | Function |
Tag 插槽
| 名称 | 描述 |
|---|---|
| default | 自定义默认内容 |
CheckTag API
CheckTag 属性
| 名称 | 描述 | 类型 | 默认值 |
|---|---|---|---|
| checked / v-model:checked | 是否选中 | boolean | false |
| disabled 2.8.2 | 是否禁用该可选中标签 | boolean | false |
| type 2.5.4 | 可选中标签的类型 | 枚举 | 主要 |
CheckTag 事件
| 名称 | 描述 | 类型 |
|---|---|---|
| change | 点击可选中标签时触发 | Function |
CheckTag 插槽
| 名称 | 描述 |
|---|---|
| default | 自定义默认内容 |