不使用keep-alive ,缓存el-table浏览记录，如何实现

当您想要避免表格组件`el-table`的页面刷新时保留浏览记录，但不依赖浏览器的HTTP连接保持（Keep-Alive），可以考虑以下几种策略：

1. **本地存储**（LocalStorage或SessionStorage）：
- 在用户浏览每个表格页时，将当前页的数据和分页状态存储到本地。当用户返回时，读取这些数据并动态渲染，而不是发送新的请求。

axios.get('/api/data')
  .then(response => {
    localStorage.setItem('tableData', JSON.stringify(response.data));
    localStorage.setItem('currentPage', response.current_page);
  });

加载时检查本地是否有数据，有的话就直接从缓存中获取。

2. **URL参数化**：
- 将当前页数等信息附加到URL上，例如 `/?page=1&perPage=10`。前端监听hashchange事件，当URL变化时更新表格内容。

function updateTable(page) {
  axios.get(`/api/data?page=${page}`)
    .then(response => {
      renderTable(response.data);
    });
}

window.addEventListener('hashchange', () => {
  const currentPage = parseInt(window.location.hash.slice(1), 10);
  if (currentPage > 0) {
    updateTable(currentPage);
  }
});

3. **自定义滚动位置恢复**：
- 如果表格是分页滚动的，可以在用户滚动到底部或顶部时保存滚动位置，并在下次访问时恢复。

// 滚动事件处理函数
window.addEventListener('scroll', () => {
  // 保存滚动位置
  window.scrollPosition = {top: window.pageYOffset};
});

// 页面加载完成后再恢复滚动位置
document.addEventListener('DOMContentLoaded', function() {
  if ('scrollPosition' in window) {
    window.scrollTo({ top: window.scrollPosition.top });
  }
});

请注意，以上方法都是为了提高用户体验，而非真正的服务器端数据持久化。如果需要真正意义上的记录浏览历史，还是建议使用服务器端技术如cookie或数据库。