首页 前端知识 【Vue/element】 el-table实现表格动态新增/插入/删除 表格行,可编辑单元格

【Vue/element】 el-table实现表格动态新增/插入/删除 表格行,可编辑单元格

2024-01-31 12:01:55 前端知识 前端哥 277 284 我要收藏

el-table实现表格动态新增/插入/删除 表格行,可编辑单元格

效果如下:

  • 点击“新增一行”可以在表格最后新增一行,单元格内容可编辑
    在这里插入图片描述
  • 点击绿色 按钮,可在指定行的后面插入一行
    在这里插入图片描述
  • 点击红色-按钮,可以删除指定行
    在这里插入图片描述
    原理:表格el-table是通过动态循环tableData生成,只要对tableData数组进行增加删除元素,就可以达到效果
    这里用了element的el-table,也可以用原生,道理一样
<template>
  <
转载请注明出处或者链接地址:https://www.qianduange.cn//article/925.html
标签
elementui
评论
会员中心 联系我 留言建议 回顶部
复制成功!