这个小功能我大概花了小半天的时间才实现，所以无比痛恨给我提这个需求的人，还好最后没有放弃，谨以此博客作为记录我被迫走上前端之路的第n天！！！
代码来自项目里面的一部分，所以可能有点乱#@&

点击事件：
这里当isEdit值为true时显示保存，否则显示历史回溯

 <div class="import" @click="historyBack"> {{ isEdit ? '保存' : '历史回溯' }}</div>

表格：

• 下述代码中，id="tableRef"是一定要设置的，tableRef可自定义，不用跟我一样，但是js里面用的时候要保持同步

 <Table :columns="columns" :data-source="dataSource" :pagination="false" :bordered="true":scroll="{ x: 'max-content', y: 'calc(100vh - 200px)' }" rowKey="info_date" id="tableRef"><template #bodyCell="{ column, text, index }"><!--如果该列为deviation_cause，则进行自定义设置--><template v-if="column.dataIndex == 'deviation_cause'"><!--如果isEdit为true，显示文本输入框，否则显示text--><span v-if="isEdit"><Input.TextArea v-model:value="dataSource[index][column.dataIndex]" /></span><div v-else>{{ text }}</div></template></template></Table>

js部分实现：

const isEdit = ref(false); // 定义并初始化isEdit
// 历史回溯
const historyBack = () => {isEdit.value = !isEdit.value; // 点击事件发生，isEdit值随之变化// 这一部分就是实现滚动条滑倒最后的核心代码nextTick(() => {const table = document.getElementById('tableRef'); //定位到表格if (table) {const scrollableArea = table.querySelector('.ant-table-body'); // 组件用的是antd的表格if (scrollableArea) {scrollableArea.scrollLeft = scrollableArea.scrollWidth; //滚动条滚动到最右侧}}});
}