el-table 表格自定义添加表格数据后自动滚动到最底部

动态表格,可以新增行列数,为了用户体验,新增后超出表格流体高度后,自动滚动到最下方

需要element-plus如下api

代码如下:

javascript 复制代码
const addCapacity = () => {
  inputList.value.push({
    name: "",
    desc: "",
    type: 2,
    location: 2,
    is_required: true,
    global_default: "",
    local_disable: true,
  });
  //滚动到最新的添加行
  nextTick(() => {
    if (inputTableRef.value) {
      const $bodyWrapper =
        inputTableRef.value.$el.querySelector(".el-table__body");
      if ($bodyWrapper) {
        inputTableRef.value.setScrollTop($bodyWrapper.scrollHeight);
      }
    }
  });
};
相关推荐
飞天大河豚1 小时前
2025前端框架最新组件解析与实战技巧:Vue与React的革新之路
vue.js·react.js·前端框架
十步杀一人_千里不留行2 小时前
React Native 下拉选择组件首次点击失效问题的深入分析与解决
javascript·react native·react.js
customer083 小时前
【开源免费】基于SpringBoot+Vue.JS医疗报销系统(JAVA毕业设计)
java·vue.js·spring boot·后端·开源
道不尽世间的沧桑3 小时前
第9篇:插槽(Slots)的使用
前端·javascript·vue.js
B站计算机毕业设计超人3 小时前
计算机毕业设计SpringBoot+Vue.jst房屋租赁系统(源码+LW文档+PPT+讲解)
vue.js·spring boot·后端·eclipse·intellij-idea·mybatis·课程设计
bin91533 小时前
DeepSeek 助力 Vue 开发:打造丝滑的滑块(Slider)
前端·javascript·vue.js·前端框架·ecmascript·deepseek
杰九3 小时前
【环境配置】maven,mysql,node.js,vue的快速配置与上手
java·vue.js·spring boot·mysql·node.js·maven
GISer_Jing3 小时前
Node.js中如何修改全局变量的几种方式
前端·javascript·node.js
秋意钟4 小时前
Element UI日期选择器默认显示1970年解决方案
前端·javascript·vue.js·elementui
程序员黄同学5 小时前
请谈谈 Vue 中的 key 属性的重要性,如何确保列表项的唯一标识?
前端·javascript·vue.js