keep-alive缓存得页面中得el-table，既想缓存跳转多少页，又想保持吸顶得功能如何实现

在使用Keep-Alive缓存功能时，特别是针对分页的El-Table组件，同时需要考虑缓存多页并保持表格内容在滚动时顶部可见的问题，可以按照以下步骤实现：

1. **Vue.js + Element UI**:
- 使用Element UI的`keep-alive`特性，它允许你在路由切换时复用组件实例，而不仅仅是视图。首先，确保将`el-table`放在`<router-view>`外面，这样在整个页面生命周期内都会存在。

   <template>
     <div>
       <el-table ref="table" :data="tableData" @scroll-top-change="onScrollTopChange"></el-table>
       <router-view></router-view> <!-- 将 Keep-Alive 放在这里 -->
     </div>
   </template>

2. **数据管理**:
- 在`v-model`绑定的数据上使用`key`属性，以便`keep-alive`可以根据数据变化来确定是否更新组件。例如，如果每页数据不同，可以设置`key`为当前页码。

   <el-table :data="pageData[currentPage]" :key="currentPage">

3. **缓存控制**:
- 在`router-view`中使用`meta`字段来传递页数信息，并监听路由变化事件，判断新路由的页数，动态清除旧表或加载新表数据。

   router.beforeEach(to, from, next) {
     if (to.meta.page !== from.meta.page) {
       // 清除旧数据或加载新数据
       this.currentPage = to.meta.page;
       this.loadTableData();
     }
     next();
   }

   methods: {
     loadTableData() {
       // 根据页数请求数据
       const data = this.fetchData(this.currentPage);
       this.tableData = data; // 设置新的tableData
     },
   }

4. **吸顶功能**:
- 通过`ref`获取`el-table`实例，在`onScrollTopChange`事件中，检查是否回到顶部，如果是，则恢复之前的排序状态或其他状态。

   methods: {
     onScrollTopChange(e) {
       if (e高度 <= 0) {
         // 恢复顶部时的状态
         this.$refs.table.restorePreviousState();
       }
     }
   }

**相关问题--:**
1. 是否可以直接使用官方提供的`el-table-column-resize`指令来实现吸顶功能？
2. 如果有大量数据，如何优化`loadTableData`函数以提高性能？
3. `fetchData`是如何设计的，以适应多页和吸顶需求？