拖拽插件sortable.js之el-table表格拖拽效果代码

问题描述

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

案例一 简单拖拽

效果图

拖拽插件sortable.js之el-table表格拖拽效果代码_第1张图片

代码附上

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





    
    sortable.js拖动例子
    
    
    
    



    

优先扣款顺序:

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

案例二 el-table表格拖拽

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

效果图

拖拽插件sortable.js之el-table表格拖拽效果代码_第2张图片

代码附上

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

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



好记性不如烂笔头,记录一下吧 ^_^

最后附上官网: http://www.sortablejs.com/
https://www.itxst.com/sortabl...

你可能感兴趣的:(拖拽element-ui)