《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 小时前
Vibe Coding时代的自我鞭策
前端·人工智能
喵个咪1 小时前
基于 Nuxt 4 的现代 Headless CMS 前端:架构深度解析与二次开发指南
前端·vue.js·nuxt.js
AI科技星1 小时前
万有引力G与真空介电常数ε0全维度完整关系式汇编(基于v=c螺旋时空理论)
c语言·开发语言·前端·javascript·网络·汇编·electron
喵个咪1 小时前
基于 Next.js 的 Headless CMS 前端架构:技术解析与二次开发导引
前端·react.js·next.js
阿白同学1054511 小时前
一座前端文明的地层:React 源码考古报告
前端
七牛云行业应用1 小时前
别手搓多Agent了!Codex Windows版用Git Worktree并行跑代码,真的香
前端
前端环境观察室1 小时前
指纹浏览器都用了,为什么任务还是要人盯着?
前端
lichenyang4531 小时前
鸿蒙聊天 Demo 练习 11:路由拦截器 + dialog 路由 + 页面生命周期
前端
铁皮饭盒1 小时前
Bun 提供了许多 Node.js 原生没有的专属 API
前端·后端
destinying1 小时前
前端秒变AI全栈,我的核心资产是一套Node.js“中间件”
前端·后端·面试