《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适用)》

相关推荐
秋天爱美丽39 分钟前
css实现圆角+边框渐变+背景半透明
前端·css
jingfeng51443 分钟前
C++ STL-string类底层实现
前端·c++·算法
cyforkk1 小时前
Hexo 双分支部署指南:从原理到 Netlify 实战
前端
小小愿望1 小时前
前端读取与导出XLSX文件实战指南(React+Ant Design)
前端
小小愿望1 小时前
JavaScript生成随机数的全面指南:别再只会用Math.random()了!
前端
用户847181054192 小时前
wps加载项ribbon.js 与 ribbon.xml 的交互
前端
Jackson__2 小时前
RAG究竟是什么?一文搞懂大模型的记忆增强术
前端
雲墨款哥2 小时前
JS算法练习-Day10-判断单调数列
前端·javascript·算法
前端市界2 小时前
前端视角: PyQt6+Vue3 跨界开发实战
前端·qt·pyqt
阅文作家助手开发团队_山神2 小时前
第四章:Flutter自定义Engine本地依赖与打包流程
前端·flutter