Empty

空状态时的展示占位图

Import: import { Empty } from '@kubed/components;'

Source: View source code

Docs: Edit this page

npm: @kubed/components

Documentation

Component Props

何时使用

当目前没有数据时，用于显式的用户提示。

基本用法

() => {
  return <Empty desc={'No_Data'} />
};

1
() => {
2
  return <Empty desc={'No_Data'} />
3
};
4

更换图标样式

你可以通过设置icon和imageStyle来设置占位图。

() => {
  const { Add } = KubeIcon;
  return <Empty desc="No_Data" icon={<Add />} imageStyle={{ width: '48px', height: '48px' }} />;
};

1
() => {
2
  const { Add } = KubeIcon;
3
  return <Empty desc="No_Data" icon={<Add />} imageStyle={{ width: '48px', height: '48px' }} />;
4
};
5