拖拽插件sortable.js实现el-table表格拖拽效果

目录

• 问题描述
• 案例一 简单拖拽
• 代码附上
• 案例二 el-table表格拖拽
• 效果图
• 代码附上

问题描述

Sortable.js是一款优秀的js拖拽库，因为是原生js写的，所以性能不错，也支持移动端哦。本文举两个案例来学习一下。

案例一 简单拖拽

效果图

代码附上

关于理解看注释哦，运行的话复制粘贴即可

    
    
    
    
    
    



    
优先扣款顺序：
    
    

        
工商银行
        
建设银行
        
中国银行
        
农业银行
        
交通银行
    
    

案例二 el-table表格拖拽

这里有一个细节，就是表头数据拖动的时候，可能导致渲染数据不对的问题，有的博主是搞两个表头数组数据的，其实也是一种解决问题的方案。不过个人愚见略有麻烦，其实一个表头数组数据即可。只要及时清空，重新赋值即可

效果图

代码附上

这里使用的是vue，所以要下载哦 cnpm install sortablejs --save

代码直接复制粘贴即可运行看效果图了，关于使用请看注释哦

最后附上官网：www.sortablejs.com/ 或: https://www.itxst.com/sortablejs/neuinffi.html

到此这篇关于拖拽插件sortable.js实现el-table表格拖拽效果的文章就介绍到这了,更多相关sortable.js 表格拖拽内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！