vuedraggable拖拽框架

第一步:安装vuedraggable依赖

复制代码
npm install vuedraggable --save-dev

第二步:引入组件

javascript 复制代码
import draggable from 'vuedraggable';

第三步:注册组件

javascript 复制代码
components: {
    draggable
},

第四步:使用组件

javascript 复制代码
<draggable group="people"
    v-model="fileData"
    animation="500"
    chosen-class="chosen"
    @change="changeEvent"
    @start="drag=true"
    @end="drag=false">
    <transition-group>

    </transition-group>
</draggable>

第五步:定义drag变量

javascript 复制代码
drag: false

第六步:定义chang方法

javascript 复制代码
changeEvent (val) {
    console.log('值发生改变', val);
}
相关推荐
运器12328 分钟前
【一起来学AI大模型】算法核心:数组/哈希表/树/排序/动态规划(LeetCode精练)
开发语言·人工智能·python·算法·ai·散列表·ai编程
gnip29 分钟前
markdown预览自定义扩展实现
前端·javascript
whoarethenext44 分钟前
使用 C++ 实现 MFCC 特征提取与说话人识别系统
开发语言·c++·语音识别·mfcc
G等你下课1 小时前
AJAX请求跨域问题
前端·javascript·http
爱编程的喵1 小时前
JavaScript闭包深度解析:从作用域到实战应用
前端·javascript
ITfeib1 小时前
Flutter
开发语言·javascript·flutter
想躺平的咸鱼干1 小时前
Volatile解决指令重排和单例模式
java·开发语言·单例模式·线程·并发编程
雪碧聊技术2 小时前
深入解析Vue中v-model的双向绑定实现原理
前端·javascript·vue.js·v-model
Owen_Q2 小时前
Denso Create Programming Contest 2025(AtCoder Beginner Contest 413)
开发语言·算法·职场和发展
·云扬·2 小时前
【Java源码阅读系列37】深度解读Java BufferedReader 源码
java·开发语言