怎么使用vuedraggable实现简单的拖拽，只拖拽一个内容（div）

发布网友 发布时间：2022-04-17 04:09

我来回答

共2个回答

懂视网 时间：2022-04-17 08:30

vue挪动贴纸位置的方法是：

　　1、首先打开vue，随后再点击拍摄按钮进行拍摄；

　　2、拍摄完了之后，点击【三个小点】，就可以详细编辑贴纸的内容了。

　　Vue系列产品为3D自然环境的动画制作和渲染提供了一系列的解决方案。Vue系列有很多不同的产品，这是为了满足不同阶层的用户的需要：可以满足专业的制作工作室，同样也能满足3D自由艺术家。PEARSON EDUCATION是PEARSON旗下的从事教育和出版行业的机构。迄今，已为全球超过1亿人提供了培训，是教育、出版一体化领域的佼佼者。拥有PEARSON PRENTICE HALL、PEARSON LONGMAN 、PEARSON SCOTT FORESMAN等知名品牌，PEARSON EDUCATION将继续面向世界，利用各种媒介手段源源不断地提供高质量的读物、实用的评估工具和先进的教育服务。

热心网友 时间：2022-04-17 05:38

仔细观察发现，今日头条导航部分编辑效果，有以下几个效果

1：点击编辑开启可以编辑的效果（也就是是否开启拖拽）

2：拖拽前选中效果

3：拖动过程中元素移动到目标位置的运动效果

这是Vue.Draggable作者的git引入之后我们发现Vue.Draggable默认就是开启拖拽状态的，那我们要控制这个状态怎么办呢？在作者项目的首页，发现并没有详细介绍，是不是有这个状态提供，当然也许是因为自己英语太渣，没有发现这句话（See here for reference）

后来发现，点进去，发现了很多好玩的东西，具体有哪些，这里我们只挑我们需要的，然后我就发现这个东东：

这不就是我们想要的么，如果你认为是这个属性直绑定到组件上，那么你就错了，在往下看，似乎有怎么使用的实例代码，那我们不妨看看是怎么样的：

其实看到这个你大概知道怎么用了，如果还不会那么不着急，我贴一下我的代码你就知道怎用了

嗯就是这么简单，然后你再去控制这个disable就可以，至于怎么控制，接触过vue的人应该都会，就不说了，到这里我们第一个问题就解决，那我后面两个问题呢？

别急，其实和第一个一模一样

还有一些其他配置项的解释：

1.ghostClass:'ghostClass';拖拽中占位的元素的类名（一般设置opacity:1）达到空出该位置的视觉效果

2.dragClass:'dragClass';元素拖拽中的类名

哈哈就是这么简单，惊不惊喜，意不意外！！！之前之所以，称之为问题是因为，以为那些配置项都是直接配置在组件上的，好了上面三个问题基本算是解决了，其实我们发现，这个过程中烦在哪里，就是知道配置项options是挂在在draggable组件上，那些控制draggable的行为都是在options里面配置的，经验告诉我们，一定要仔细阅读文档，答案都在文档里面，好了，如果能帮助到正在看文章的你