江苏龙网

  1. 主页 > 生活百科 > >

Vue拖拽

vue

说明目前重点放在别的东西上，所以这个插件不再更新，只能用于pc端，移动端自己可以fork进行优化 。
Installyarn add vue-dragging
How to use普通html
【Vue拖拽】<script src=https://www.isolves.com/it/cxkf/kj/2022-10-21/"./vue.js">是vue-drag.js不是vue-dragging.js
如果你的项目使用vue-cli搭建的 那么请这样使用:
import Vue from 'vue'import vueDrag from 'vue-dragging'Vue.use(vueDrag)在html当中添加标签，然后添加一个'v-drag'，假设为：
<div class="demo"><div class="drag" v-drag></div></div>这样绑定的dom就可以拖拽
1.1.0加入了一个可拖拽区域和不可拖区域的方法，示例如下:
<div class="demo2" v-drag="'#dragable'"><div id="dragable"><span>这里可以拖动</span></div><div class="content"><span>这里不可以</span></div></div>value传的是一个选择器，会让当前dom下第一个找到的seletor允许拖拽
如果你想让鼠标指针变成move，那么这样：
<div class="demo2" v-drag.cursor="'#dragable'"><div id="dragable"><span>这里可以拖动</span></div><div class="content"><span>这里不可以</span></div></div>当然你也可以自己写样式去替换





    推荐阅读


    上一篇：从浏览器保存的图片打不开，该咋办？

    下一篇：分布式架构 WebSocket 解决方案，学会了你就是那个架构师