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);
      }
    }
  });
};
相关推荐
C_心欲无痕3 小时前
react - 组件之间的通信
前端·javascript·react.js
Lupino3 小时前
Node.js 与 Haskell 混合网络编程踩坑记:TCP 粘包与状态不一致引发的“死锁”
javascript·node.js
走粥3 小时前
JavaScript Promise
开发语言·前端·javascript
四瓣纸鹤3 小时前
F2图表柱状图添加文本标注
前端·javascript·antv/f2
C_心欲无痕4 小时前
vue3 - watchEffect对响应式副作用进行管理
前端·javascript·vue.js
AAA阿giao4 小时前
赋予大模型“记忆”:深度解析 LangChain 中 LLM 的上下文记忆实现
javascript·langchain·llm
KoalaShane4 小时前
Web 3D设计[Three.js]关于右键点击Canvas旋转模型,在其他元素上触发右键菜单问题
前端·javascript·3d
张清悠4 小时前
CSS引入外部第三方字体
前端·javascript·css
追逐梦想之路_随笔4 小时前
手撕Promise,实现then|catch|finally|all|allSettled|race|any|try|resolve|reject等方法
前端·javascript
Tzarevich4 小时前
Tailwind CSS:原子化 CSS 的现代开发实践
前端·javascript·css