vue+element-ui+sortable.js实现表格拖拽功能

本文实例为大家分享了vue+element-ui+sortable.js实现表格拖拽的具体代码,供大家参考,具体内容如下

效果如下:

vue+element-ui+sortable.js实现表格拖拽功能_第1张图片

1.vue使用cli创建项目就不说了,本人使用的是cli3.x版本

2.下载element-ui

npm i element-ui -S

3.引入element-ui,找到main.js,加入如下代码

// 导入element-ui,和全局使用element-ui样式
import ElementUI from "element-ui";
import "element-ui/lib/theme-chalk/index.css";

// 使用 ElementUI 组件库
Vue.use(ElementUI);

4.下载sortablejs,官网为http://www.sortablejs.com/index.html,可在里面看你需要的效果(配置项)

npm install sortablejs --save

5.效果图的全部代码



以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持脚本之家。

你可能感兴趣的:(vue+element-ui+sortable.js实现表格拖拽功能)