<script setup>
  import Demo from './Demo.vue'
</script>

### 基础用法

type 共有四种类型： 权限 auth、数据 data、房间 room、列表 list

<Demo type="basic" />

### 新类型用法

type 共有三种类型： 无数据 empty、失败 error、等待 wait

<Demo type="newType" />

### 自定义图片和文案

自定义图片 imgUrl 接受图片地址、label 接受图片文案；imgUrl 和 type 冲突，优先显示 type

<Demo type="custom" />

### 插槽 img 和 label

`slot="img"`图片和`slot="label"`文案

<Demo type="slot" />

### 图片宽度 width 和高度 height

宽高类型是 Number，单位是 px

<Demo type="px" />

### position 图片和文案的位置

position 定义图片和文案的位置，默认上下，可选 left-right 左右，图片左，文案右

<Demo type="pos" />

### 隐藏文字或者图片

<Demo type="hide" />

### Attributes

| 参数     | 说明                                          | 类型   | 可选值                    | 默认值 |
| -------- | --------------------------------------------- | ------ | ------------------------- | ------ |
| type     | 类型                                          | string | auth / data / room / list | -      |
| imgUrl   | 自定义图片 url，和 type 冲突时，优先显示 type | string | —                         | true   |
| label    | 自定文案，和 type 冲突时，优先显示 type       | string | —                         | false  |
| width    | 图片宽度，单位是 px                           | Number | 180                       | -      |
| height   | 图片高度，单位是 px                           | Number | —                         | -      |
| position | 图片和文案的相对位置，默认上下                | string | left-right                | -      |
| show-image | 展示图片                | boolean | -                | true      |
| show-text | 展示文字                | boolean | -               | true      |

### Slot

| name  | 说明 |
| ----- | ---- |
| img   | 图片 |
| label | 文案 |
