使用el-table时，如何避免冻结列影响滚动？

在使用 Element UI 的 `el-table` 组件时，有时会遇到冻结列（fixed columns）影响表格滚动的问题。为了避免这种情况，你可以采取以下几个策略：

1. **动态调整列宽**：通过监听窗口大小变化，动态调整非冻结列的宽度，留出足够的空间供用户滚动。这通常在 `mounted()` 或 `window.resize` 事件的回调函数中完成，使用 `this.$refs.table.updateColumns()` 更新列宽。

mounted() {
  window.addEventListener('resize', this.handleResize);
}

updated() {
  this.handleResize();
}

methods: {
  handleResize() {
    const visibleColumns = this.columns.filter(col => !col.fixed); // 获取可见非冻结列
    const totalWidth = visibleColumns.reduce((sum, col) => sum + col.width, 0);
    const containerWidth = this.$refs.tableContainer.clientWidth; // 表格容器的实际宽度
    const remainingWidth = containerWidth - this.$refs.header.clientWidth; // 减去冻结列占据的空间

    if (totalWidth > remainingWidth) { // 如果剩余空间不足滚动
      const newColumnWidths = visibleColumns.map(col => Math.floor(col.width * remainingWidth / totalWidth)); // 调整每列宽度
      this.$refs.table.updateColumns(newColumnWidths);
    } else {
      // 如果还有足够的空间，保持原始宽度
      this.$refs.table.updateColumns(); // 或者直接更新回原始列宽
    }
  }
}

2. **隐藏不必要的滚动条**：如果不需要滚动条，可以尝试设置 `::-webkit-scrollbar` 属性为 `none`，仅适用于 WebKit 内核的浏览器（如 Chrome、Safari 等）。但请注意，这样可能会让用户难以理解页面是否有未显示的部分。

3. **限制内容高度**：如果数据量非常大，可以考虑对表格内容进行分页或者滚动加载，只展示部分数据，减少滚动的需求。

记住在使用这些技巧之前，确保你已经理解了你的应用场景以及用户体验的重要性。如果你有特定的需求，可以根据实际需求定制解决方案。