# Empty 内容为空
该组件用于需要加载内容，但是加载的第一页数据就为空，提示一个"没有内容"的场景， 我们精心挑选了十几个场景的图标，方便您使用。
# 平台差异说明
| App | H5 | 微信小程序 | 支付宝小程序 | 百度小程序 | 头条小程序 | QQ小程序 |
|---|---|---|---|---|---|---|
| √ | √ | √ | √ | √ | √ | √ |
# 基本使用
提示
从1.4.2版本起，移除了此组件内置的图片，因为这些图片太大，影响了组件库的大小。改用字体图标的形式提供，缺点是字体图标只能是单色的，形状与原来的图片也有些许出入。 基于以上，我们的专业设计师精心为您准备了一套精美缺省图，带有图片和Sketch文件，您可以下载或修改后再使用：资源下载
- 通过
text参数配置提示的文字内容 - 通过
mode(默认为data)参数配置要显示的图标
<template>
<u-empty :theme="theme" :mode="mode">
<u-button v-if="slot" slot="bottom" size="medium">
操作按钮
</u-button>
</u-empty>
</template>
<script>
export default {
data() {
return {
theme: 'normal',
mode: 'data',
slot: false
}
}
}
</script>
# 内置图标
这些图标已内置，直接通过mode参数引用即可
| 名称 | 说明 |
|---|---|
| data | 暂无数据(默认) |
| load | 加载失败 |
| message | 暂无消息 |
| network | 网络出错 |
| page | 页面不存在 |
| search | 没有搜索结果 |
| server | 服务器出错 |
| site | 暂无站点 |
| video | 该点位无视频监控 |
| alarm | 暂无预警 |
| permission | 该账号暂无权限 |
| target | 暂未制定目标 |
| exceedStandard | 暂无超标企业 |
| archive | 正在归档，请稍后… |
# API
# Props
| 参数 | 说明 | 类型 | 默认值 | 可选值 |
|---|---|---|---|---|
| theme FPI | 主题模式，普通模式normal，关怀模式care | String | normal | care |
| color | 文字颜色 | String | #c0c4cc | - |
| text | 文字提示 | String | 无内容 | - |
| icon-color 1.4.2 | icon的颜色，字体图标时有效 | String | #c0c4cc | - |
| icon-size 1.4.2 | icon的大小，单位rpx，如果src为图片路径，此参数可以设置图片的尺寸 | String | Number | 120 | - |
| src | 图标名称或者图片路径(绝对路径)，如定义，mode参数会失效 | String | - | - |
| font-size | 提示文字的大小，单位rpx | String | Number | 28 | - |
| mode | 内置的图标，见上方说明 | String | data | - |
| img-width 1.4.2起废弃 | 图标的宽度，单位rpx | String | Number | 240 | - |
| img-height 1.4.2起废弃 | 图标的高度，单位rpx | String | auto | - |
| show | 是否显示组件 | Boolean | true | false |
| margin-top | 组件到上一个元素的间距,单位rpx | String | Number | 0 | - |
# Slot
| 名称 | 说明 |
|---|---|
| bottom | 给组件底部传入slot内容 |