ant-design-vue的table组件自定义空状态

场景：

如图所示，图片上半部分是表格，下半部分是另外模块的暂无数据展示。为了优化用户体验，想把表格中的图片（icon）替换为下面的图片。

解决方案：

经查知ant-design 官方提供了空状态案例，结合configProvider全局化配置就可以啦。

查文档没有发现可以调整单个表格空状态的例子，唯有全局化配置：?

<template>
  <a-config-provider :locale="locale">
    <template #renderEmpty>
        <div style="text-align: center">
          <img :src="img" alt="">
          <p>暂无数据</p>
        </div>
      </template>
    <div id="app">
      <router-view/>
    </div>
  </a-config-provider>
</template>
<script>
  import zhCN from 'ant-design-vue/lib/locale-provider/zh_CN'
  import enquireScreen from '@/utils/device'
  import { updateTheme } from '@/components/tools/setting'

  export default {
    data () {
      return {
        locale: zhCN,
        img: require('@/assets/nodata.png')
      }
    },
  }
</script>

解决结果：