fg-empty空页面

介绍

页面或列表中的数据为空时显示的视图，空页面内包含空视图和错误视图

代码演示

默认配置下的空视图

<fg-empty />

默认配置下的错误视图

<fg-empty :is-error="true" />

自定义空页面

<fg-empty
  ref="empty"
  :empty-data="emptyData"
  :error-data="errorData"
  :is-error="isError"
  @actionClick="actionClick"
  @subActionClick="subActionClick"
/>
data() {
  return {
    // isError为false时显示空视图，为true时显示错误视图
    isError: false,
    // 配置空视图
    emptyData: {
      type: 'visitor',
      desc: '没有找到访客数据',
      action: '重试',
      subAction: '返回',
      actionStyle: 'BUTTON',
    },
    // 配置错误视图
    errorData: {
      title: '网络异常',
      desc: '无法连接服务器，请检查你的网络设置',
      action: '重试',
    },
  }
},

API

- network (网络异常)

- login (登陆类)

- visitor (访客类)

- star (收藏类)

- diary (日记类)

- share (分享类)

- customer (客户类)

- subscribe (订阅类)

- message (消息类)

- pay (支付类)
| String | ‘common’ | | image | 自定义空视图所展示的图片，不为空时覆盖type属性所指定的图片 | String | ‘’ | | title | 主标题 | String | ‘’ | | desc | 说明文字 | String | ‘’ | | action | 操作名，传值后主操作按钮会显示，点击后actionClick发送事件 | String | ‘’ | | subAction | 次操作名，传值后次操作按钮会显示，点击后发出subActionClick事件 | String | ‘’ | | actionStyle | 指定action和subAction的样式
可选类型：
- TEXT（action和subAction都为蓝色文字样式的按钮）

- BUTTON（action蓝底白字，subAction白底黑字）
| String | ‘TEXT’ |