element plus 表格为空时 显示图片 且上下左右居中

您可以通过以下步骤实现 element plus 表格为空时显示图片且上下左右居中的效果：

1. 在 template 中添加一个 div 包裹 el-table，并设置其样式为 position: relative。

2. 新增一个 img 标签，并设置其样式为 position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%);。

3. 给 img 标签添加 v-if 指令，当表格为空时显示该图片。可以通过计算表格数据数组的长度来判断表格是否为空。

4. 在 el-table 中添加一个 slot="empty" 的插槽，并将 img 标签放入该插槽中。

以下是示例代码：

<template>
  <div class="table-wrapper">
    <el-table :data="tableData">
      <!-- 表格列定义 -->
      <template slot="empty">
        <img v-if="tableData.length === 0" src="empty.png" alt="暂无数据">
      </template>
    </el-table>
  </div>
</template>

<style>
.table-wrapper {
  position: relative;
}

.table-wrapper img {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}
</style>

<script>
export default {
  data() {
    return {
      tableData: [], // 表格数据
    }
  },
}
</script>

注意：需要将 empty.png 图片放到项目的静态资源目录中。