el-table空白时，加上el-empty，保留表头

在Element UI的表格组件`el-table`中，当数据为空显示不出内容时，可以利用`el-empty`指令来展示自定义的空状态提示，并同时保持表头可见。`el-empty`通常放在`el-table`标签内部，用于替代默认的空列表提示。

例如：

<template>
  <div>
    <el-table :data="tableData" style="width: 100%">
      <el-table-column type="index"></el-table-column>
      <!-- 其他表头列 -->
      <el-table-column prop="propName" label="属性名称"></el-table-column>
      <el-loading :visible.sync="isLoading" append-to-body></el-loading>
      <el-empty v-if="isEmpty && !isLoading" :message="emptyMessage">
        没有数据，{{ emptyText }}
      </el-empty>
    </el-table>
  </div>
</template>

<script>
export default {
  data() {
    return {
      tableData: [], // 数据数组
      isLoading: false,
      isEmpty: true, // 初始时设置为true，表示无数据
      emptyMessage: '暂无数据', // 自定义空状态消息
      emptyText: '加载更多', // 可选，自定义按钮文本
    };
  },
  methods: {
    fetchData() { /* 加载数据的方法 */ }
  },
  created() {
    this.fetchData();
  },
};
</script>

在这个例子中，当`tableData`为空且`isLoading`为`false`时，`el-empty`会显示出来，显示自定义的空状态信息并保留表头。当数据加载完成后，你可以通过改变`isEmpty`为`false`来隐藏`el-empty`。