ant-design/components/empty/index.zh-CN.md
信鑫-King cb528da8ed
fix: dark theme in 4.0 (#20642)
* fix: rtl direction bug

* 📝 dark theme usage docs

* fix: sketch download

* fix: theme dark

* 📝 empty image

* fix: dark form with mixture components like picker, input

* 📝 update sketch release download

* fix: remove inline-menu sub shadow
2020-01-03 19:00:01 +08:00

62 lines
1.7 KiB
Markdown

---
category: Components
subtitle: 空状态
type: 数据展示
title: Empty
cols: 1
---
空状态时的展示占位图。
## 何时使用
- 当目前没有数据时,用于显式的用户提示。
- 初始化场景时的引导创建流程。
## API
```jsx
<Empty>
<Button>创建</Button>
</Empty>
```
| 参数 | 说明 | 类型 | 默认值 | 版本 |
| --- | --- | --- | --- | --- |
| description | 自定义描述内容 | string \| ReactNode | - | |
| imageStyle | 图片样式 | CSSProperties | - | |
| image | 设置显示图片,为 string 时表示自定义图片地址。 | string \| ReactNode | `Empty.PRESENTED_IMAGE_DEFAULT` | |
## 内置图片
- Empty.PRESENTED_IMAGE_SIMPLE
<div class="site-empty-buildIn-img site-empty-buildIn-simple"><div>
- Empty.PRESENTED_IMAGE_DEFAULT
<div class="site-empty-buildIn-img site-empty-buildIn-default"></div>
<style>
.site-empty-buildIn-img {
background-repeat: no-repeat;
background-size: cover;
}
.site-empty-buildIn-simple {
width: 55px;
height: 35px;
background-image: url("https://user-images.githubusercontent.com/507615/54591679-b0ceb580-4a65-11e9-925c-ad15b4eae93d.png");
}
.site-empty-buildIn-default {
width: 121px;
height: 116px;
background-image: url("https://user-images.githubusercontent.com/507615/54591670-ac0a0180-4a65-11e9-846c-e55ffce0fe7b.png");
}
[data-theme="dark"] .site-empty-buildIn-simple {
background-image: url("https://alipay-rmsdeploy-image.cn-hangzhou.alipay.aliyun-inc.com/antfincdn/oQFqhkmNPw/a38d2cdb-a33d-407c-8f8e-e3429699175d.png");
}
[data-theme="dark"] .site-empty-buildIn-default {
background-image: url("https://gw.alipayobjects.com/mdn/rms_08e378/afts/img/A*gfq-SoT3wF0AAAAAAAAAAABkARQnAQ");
}
</style>