《ElementUI/Plus 踩坑》el-table + sortablejs 拖拽顺序错乱(Vue2/3适用)

如图所示:

  • 把第一行拖到最后一行,鼠标up
  • 该行莫名其妙的跳到倒数第二行;

最后发现没有设置 el-table 属性 row-key ,即行数据的 Key,用来优化 table 的渲染;

属性 row-key 描述如下:

一定要设置

html 复制代码
<el-table class="my-table" :data="tableData" style="width: 100%" row-key="id">
    <el-table-column prop="date" label="Date" width="180" />
    <el-table-column prop="name" label="Name" width="180" />
    <el-table-column prop="address" label="Address" />
</el-table>

PS:如果想进一步了解如何实现,请移步 《ElementUI/Plus:el-table + sortablejs 实现 row 拖动改变顺序(Vue2/3适用)》

相关推荐
一千柯橘1 分钟前
Three.js 中的调试助手 OrbitControls + GUI
前端
一 乐1 分钟前
购物商城|基于SprinBoot+vue的购物商城系统(源码+数据库+文档)
前端·javascript·数据库·vue.js·spring boot·后端
玥浛1 分钟前
ELK.js 实战:大规模图布局性能优化方案
前端
特级业务专家3 分钟前
React Fiber 和时间切片
前端
z***D6484 分钟前
SpringBoot3+Springdoc:v3api-docs可以访问,html无法访问的解决方法
前端·html
www_stdio4 分钟前
JavaScript 面向对象编程:从原型到 Class 的演进
前端·javascript
海云前端14 分钟前
国产前端神器 @qnvip/core 一站式搞定 90% 业务痛点
前端
用户4445543654265 分钟前
TooltipBox在Compose里
前端
gustt5 分钟前
JavaScript 面向对象编程:从对象字面量到原型链继承,全链路彻底讲透
前端·javascript·面试
liberty88815 分钟前
dppt如何找到弹框
java·服务器·前端