UniApp 组件 · 实验
UGEmptyState 空状态
用于无数据场景的空状态组件。
组件预览
以下画面来自同一组件源码的 H5 构建，用于检查内容、状态和主题；MP-WEIXIN 最终外观仍以开发者工具和真机为准。
使用方式
配置 easycom 后直接使用 <ug-empty-state>，无需在页面脚本中导入组件。
vue
<template>
<ug-empty-state title="暂无记录" description="完成一次操作后，内容会显示在这里。">
<template #action><ug-button size="sm" variant="outline">重新加载</ug-button></template>
</ug-empty-state>
</template>
easycom 公开入口：@ug666/ui-uniapp/components/ug-empty-state/ug-empty-state.vue
属性
| 属性 | 类型 | 默认值 | 说明 |
|---|---|---|---|
| title | string | '暂无内容' | 空状态标题。 |
| description | string | — | 简短说明或下一步建议。 |
| size | 'sm' | 'md' | 'lg' | 'md' | 控制文字层级和区域内边距。 |
事件
当前组件没有公开事件。
注意事项
- 默认不注入品牌插画；业务需要时使用 illustration 插槽。
- 操作通过 action 插槽组合 Button，不在 EmptyState 内置业务事件。
平台边界
总览中的画面来自同一组件源码的 H5 构建，只用于辅助浏览；小程序真实外观仍以 Demo 在微信开发者工具和真机中的结果为准。
MP-WEIXIN 已编译
开发者工具与真机待验证