在vue3项目中，在el-table添加一条数据后，自动滚动到table底部，怎么实现？

在 Vue3 的项目中，要在 `el-table` 添加数据后自动滚动到底部，你可以利用 Element UI 提供的 `@row-add` 事件以及 `nextTick` 来实现这个功能。这里是一个简单的示例：

<template>
  <el-table :data="tableData" ref="tableRef">
    <!-- table columns here -->
    <el-table-column type="action" label="操作">
      <template slot-scope="{ row }">
        <el-button @click="addRow(row)">新增</el-button>
      </template>
    </el-table-column>
  </el-table>
</template>

<script>
export default {
  data() {
    return {
      tableData: [],
    };
  },
  methods: {
    addRow(row) {
      this.tableData.push(row); // 添加新行

      // 使用 nextTick 确保 DOM 更新完成后再执行滚动操作
      this.$nextTick(() => {
        // 调整表格元素的 scrollHeight 到可视区域下边界，然后滚动到底部
        this.$refs.tableRef.scrollToBottom();
      });
    }
  },
};
</script>

在这个例子中，当点击“新增”按钮时，会先将新行添加到 `tableData` 中，然后在 `nextTick` 后，滚动 `tableRef`（el-table的实际DOM引用）到底部。