vue+sortable实现多张图片拖拽排序

vue+sortable实现图片可拖拽换位,并且数据跟着改变

文章目录

    • vue+sortable实现图片可拖拽换位,并且数据跟着改变
  • 前言
  • 一、实现效果
  • 二、使用步骤
  • 总结


前言

本人实现的方式是通过引入的方式实现,如果用脚手架的方式应该也差不多

一、实现效果

二、使用步骤

1、获取到展示图片的最外层节点,我的最外层节点为ref=“foo”
2、如下图代码
vue+sortable实现多张图片拖拽排序_第1张图片
实现的方法实际上就是对数组的一个操作,oldIndex是移动之前的下标,newIndex是移动之后的下标

总结

以上就是我要分享的内容,刚接到这个任务的时候也查了好的资料,最后才做出来的,希望对你有帮助。
sortable.js的地址:http://www.sortablejs.com/

你可能感兴趣的:(vue+element,ui+sortable,vue.js,elementui,排序)