UniApp 组件 · 实验
UGTag 标签
支持语义变体和关闭操作的内联标签。
组件预览
以下画面来自同一组件源码的 H5 构建，用于检查内容、状态和主题；MP-WEIXIN 最终外观仍以开发者工具和真机为准。
使用方式
配置 easycom 后直接使用 <ug-tag>，无需在页面脚本中导入组件。
vue
<template>
<ug-tag tone="primary" closable @close="removeTag">MP-WEIXIN</ug-tag>
</template>
easycom 公开入口：@ug666/ui-uniapp/components/ug-tag/ug-tag.vue
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| tone | 'neutral' | 'primary' | 'success' | 'warning' | 'danger' | 'neutral' | 标签语义色调。 |
| size | 'sm' | 'md' | 'lg' | 'md' | 标签尺寸。 |
| closable | boolean | false | 显示关闭操作。 |
| disabled | boolean | Provider | 禁用关闭操作。 |
事件
| 事件 | 参数 | 说明 |
|---|---|---|
| close | event | 点击可用的关闭操作时触发，是否移除由业务层决定。 |
注意事项
- close 只通知调用方，不在组件内部隐藏标签。
- 长文字会单行截断，完整内容应由页面提供其他查看方式。
平台边界
总览中的画面来自同一组件源码的 H5 构建，只用于辅助浏览；小程序真实外观仍以 Demo 在微信开发者工具和真机中的结果为准。
MP-WEIXIN 已编译
开发者工具与真机待验证