空状态 Empty

用于展示空状态的组件,通常在没有数据时显示。

何时使用

  • 数据加载完成但为空时
  • 搜索无结果时
  • 页面初始化状态时
  • 任何需要提示用户当前无数据的场景

示例

基础用法

最简单的用法,显示默认的空状态图标和文字。

正在加载组件...
code

自定义文字

可以通过子元素来自定义提示文字。

正在加载组件...
code

自定义图标

通过 icon 属性可以自定义空状态图标。

正在加载组件...
code

带操作按钮

可以在空状态中添加操作按钮,引导用户进行下一步操作。

正在加载组件...
code

API

Empty

参数说明类型默认值
icon自定义图标ReactNode-
children提示文字(插槽)ReactNode'暂无数据'
className自定义类名string-