Tag 标签

用于标记和选择的标签

基本用法

加载中,请稍后。。。

不同的模式

加载中,请稍后。。。

标签颜色

标签有几种预设的色彩样式,可以通过设置 color 属性为 active、inactive、error、success、iprocessing、warning 用作不同场景使用。如果预设值不能满足需求,可以设置为具体的色值

加载中,请稍后。。。

自定义样式

可以通过 style 来控制背景、边框及文字颜色。如下

加载中,请稍后。。。

属性表

属性名 类型 默认值 说明
displayMode 'normal' | 'rounded' | 'status' normal 展现模式
color 'active' | 'inactive' | 'error' | 'success' | 'processing' | 'warning' | 具体色值 颜色主题,提供默认主题,并支持自定义颜色值
label string - 标签内容
icon SchemaIcon dot 图标 status 模式下的前置图标
className string 自定义 CSS 样式类名
style object {} 自定义样式(行内样式),优先级最高
closable boolean false 是否展示关闭按钮

事件表

2.6.1 及以上版本

当前组件会对外派发以下事件,可以通过onEvent来监听这些事件,并通过actions来配置执行的动作,在actions中可以通过${事件参数名}${event.data.[事件参数名]}来获取事件产生的数据,详细查看事件动作

事件名称 事件参数 说明
click label: string 鼠标事件对象 点击时触发
mouseenter label: string 鼠标事件对象 鼠标移入时触发
mouseleave label: string 鼠标事件对象 鼠标移出时触发
close label: string 鼠标事件对象 关闭时触发

click

鼠标点击。可以尝试通过${event.context.nativeEvent}获取鼠标事件对象。

加载中,请稍后。。。

mouseenter

鼠标移入。可以尝试通过${event.context.nativeEvent}获取鼠标事件对象。

加载中,请稍后。。。

mouseleave

鼠标移出。可以尝试通过${event.context.nativeEvent}获取鼠标事件对象。

加载中,请稍后。。。

close

鼠标点击关闭标签。可以尝试通过${event.context.nativeEvent}获取鼠标事件对象。

加载中,请稍后。。。