Tui
快速开始
组件文档
更新日志
0.7.2
🌙 深色模式
Tag 标签
用于标记状态或分类的小型标签,提供多种语义类型和尺寸可选。
基础用法
最常见的标签形式,支持多种语义类型。
默认
主要
警告
成功
错误
示例代码
vue
不同尺寸
通过
size
属性设置尺寸,支持
mini
、
small
、
medium
、
large
四种预设值。默认使用
medium
尺寸。
超小标签
小标签
中等标签
大标签
示例代码
vue
可交互效果
通过
@click
事件识别可交互效果, 提供
cursor
和
hover
的样式。暂时不提供 props 控制交互效果的开启。
可交互效果
示例代码
vue
关闭效果
通过
closeable
来实现可关闭标签,支持动态添加和删除。
增加可关闭标签
可关闭标签0
示例代码
vue
状态类型、自定义样式
通过
color
和
bg
属性参数来自定义样式。
自定义颜色
示例代码
vue
属性 Props
属性名
说明
类型
可选值
默认值
版本说明
type
语义类型
string
default / primary / success / warning / error
default
changed 0.5.2
size
标签尺寸
string
mini / small / medium / large
medium
closeable
是否可关闭
boolean
false
color
自定义颜色
string
bg
自定义背景颜色
string
事件 Events
事件名
说明
回调参数
版本说明
close
关闭时触发
void
基础用法
不同尺寸
可交互效果
关闭效果
状态类型、自定义样式
属性 Props
事件 Events