el-row中怎么设置滚动条

在el-row中设置滚动条，可以通过给el-row的任何一级父元素设置一定的padding或者margin值来解决。这个值要大于等于gutter，才能让横向滚动条消失。例如，在body元素中给它设置padding值即可：
body { padding: 0 20px; }
这样，el-row的横向滚动条就会消失了。<span class="em">1</span><span class="em">2</span>

相关问题

el-table设置横向滚动条位置

要设置 `el-table` 的横向滚动条位置，你可以使用 `ref` 属性来获取 `el-table` 组件的实例，然后在 `mounted` 钩子函数中使用 `$nextTick` 方法等待表格渲染完成，再通过修改 `scrollLeft` 属性来调整横向滚动条的位置。下面是一个示例代码：

<template>
  <el-table
    ref="table"
    :data="tableData"
    style="width: 100%; white-space: nowrap;"
    :row-class-name="tableRowClassName"
  >
    <!-- 表格列 -->
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [], // 表格数据
    };
  },
  mounted() {
    this.$nextTick(() => {
      const tableEl = this.$refs.table.$el.querySelector('.el-table__body-wrapper');
      tableEl.scrollLeft = 200; // 设置横向滚动条位置
    });
  },
  methods: {
    tableRowClassName({ row, rowIndex }) {
      // 自定义表格行样式
    },
  },
};
</script>

在这个示例代码中，我们通过 `ref` 属性获取了 `el-table` 组件的实例，并在 `mounted` 钩子函数中使用 `$nextTick` 方法等待表格渲染完成。然后，我们通过 `querySelector` 方法获取了表格的主体元素，即 `el-table__body-wrapper`，并修改了它的 `scrollLeft` 属性来调整横向滚动条的位置。注意，为了让表格可以横向滚动，我们还需要将表格容器的 `width` 样式设置为 `100%`，并将表格列的 `white-space` 样式设置为 `nowrap`。

el-table设置height滚动条不展示

在Vue的Element UI库中，如果你设置了`el-table`的高度并且希望显示滚动条但是它没有自动显示，可以尝试以下步骤：

1. 确保`el-table`容器有固定的高度值，例如 `style="height: 400px; overflow-y: auto;"`。这会让元素内容超出时显示滚动条。

2. 如果你使用的是一行式的高度而非固定的行高，比如`v-bind:row-height="rowHeight"`，那么需要保证`rowHeight`计算后的总高度超过设置的容器高度，滚动条才会显示。

3. 检查是否有其他CSS样式覆盖了滚动条的样式，如`.el-table__body-wrapper::-webkit-scrollbar` 或 `.el-scrollbar`等类的隐藏设置。

4. 使用`show-loading`属性时，如果数据加载完成后才填充表格，可能会因为初始高度为0导致滚动条不会立即出现。你需要在数据加载完成后再调整高度。

5. 如果以上都检查过了还是不行，可以在表格外面包裹一层`div`并设置滚动条，然后将`el-table`嵌套其中，这样也可以达到控制滚动效果的目的。

<div style="height: 400px; overflow-y: auto;">
  <el-table :data="tableData" :height="tableHeight"></el-table>
</div>