el-table如何使用el-skeleton

el-table是饿了么UI库中的一个表格组件，而el-skeleton是饿了么UI库中的一个骨架屏组件。在使用el-table时，我们可以结合el-skeleton来增强用户体验。具体实现方式如下：

1. 在el-table的外层包裹一个el-skeleton，并将其隐藏起来
2. 在数据加载前，显示el-skeleton，并隐藏el-table
3. 数据加载完成后，隐藏el-skeleton并显示el-table

以下是示例代码：

<template>
  <div>
    <el-skeleton :loading="loading" :animated="true">
      <el-table v-if="!loading" :data="tableData" style="width: 100%">
        <!-- table columns -->
      </el-table>
    </el-skeleton>
  </div>
</template>

<script>
export default {
  data() {
    return {
      loading: true,
      tableData: []
    };
  },
  mounted() {
    setTimeout(() => {
      this.tableData = [
        // table data
      ];
      this.loading = false;
    }, 2000);
  }
};
</script>

以上代码中，在组件加载时，我们设置了loading为true，并在mounted钩子函数中模拟了一个2秒钟的数据加载过程。在数据加载前，el-table是不可见的，而el-skeleton是可见的。当数据加载完成后，我们将el-table显示出来，并将el-skeleton隐藏。这样就可以实现在数据加载过程中显示一个骨架屏，增强用户体验。