el-table利用expand属性添加子列表后 主列表出现横线滚动条，往左滚动整个tbody与右侧固定列断开了

这个问题可能是由于子列表的宽度超出了主列表的宽度，导致出现了横向滚动条。当你往左滑动时，子列表会继续保持在原来的位置，而主列表则会向左滑动，导致主列表和子列表之间出现了断开。

解决这个问题的方法有两种：

1. 调整子列表的宽度，使其不超出主列表的宽度。可以通过设置子列表的样式或者使用 el-table-column 的 width 属性来调整宽度。

2. 使用固定列的功能。可以将需要固定的列通过设置 fixed 属性来实现。这样，在滑动时，固定列会一直保持在左侧，不会和主列表产生断开。

希望这些方法能够帮助到你解决问题。如果还有其他问题，可以继续提问。

相关问题

表格添加expand属性后，会有一列类名el-table_1_column_19 undefined el-table__expand-column is-leaf el-table__cell的空白

当在ECharts Table (`el-table`) 中添加 `expand` 属性用于展开行功能后，确实会增加一行用于显示/隐藏展开内容的列，通常这一列会有特定的类名，例如 `el-table_1_column_19`、`undefined`、`el-table__expand-column`、`is-leaf` 和 `el-table__cell` 等。有时候，这个列可能会因为某些原因变得不可见或者呈现空白，这可能是以下几个原因：

1. **初始渲染问题**：数据加载不完整或者渲染策略有误，导致这部分列的内容还没有正确填充。
2. **样式覆盖**：如果有CSS样式无意间设置了 `display: none` 或者 `width: 0`，这将使列看起来像是空白的。
3. **数据状态问题**：如果表格的数据结构设计不当，导致该列对应的属性值不存在或者未被正确处理，也可能造成空白。

解决此类问题的步骤包括：

- 检查数据源是否正确，特别是展开列对应的数据字段是否都有值。
- 查看CSS样式，确保展开列的样式没有意外设置为隐藏。
- 使用开发者工具查看元素的样式和状态，确认是否存在问题。

通过type="expand"给el-table添加了子列表，导致hover背景色错乱了，修复不起作用

这个问题可能是由于使用了 expand 属性后，子列表的样式覆盖了原本父列表的样式所导致的。解决这个问题可以尝试以下方法：

1. 在 el-table 中添加一个 slot-scope="props" 的属性，并在子组件中使用该属性继承父组件的样式：

<el-table :data="tableData" style="width: 100%">
  <el-table-column label="姓名" prop="name">
  </el-table-column>
  <el-table-column label="年龄" prop="age">
  </el-table-column>
  <el-table-column label="地址" prop="address" type="expand">
    <template slot-scope="props">
      <div class="child-table">
        <el-table :data="props.row.children" style="width: 100%">
          <el-table-column label="子列表姓名" prop="name">
          </el-table-column>
          <el-table-column label="子列表年龄" prop="age">
          </el-table-column>
        </el-table>
      </div>
    </template>
  </el-table-column>
</el-table>

2. 在样式中使用 /deep/ 或 ::v-deep 选择器来覆盖子组件的样式：

.el-table__row:hover {
  background-color: #f5f7fa !important;
}

/* 使用 /deep/ 选择器 */
.child-table /deep/ .el-table__row:hover {
  background-color: #f5f7fa !important;
}

/* 使用 ::v-deep 选择器 */
.child-table ::v-deep .el-table__row:hover {
  background-color: #f5f7fa !important;
}

以上两种方法都可以解决 hover 背景色错乱的问题，具体使用哪种方法可以根据实际情况选择。