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);
}
相关推荐
鱼香鱼香rose7 分钟前
java-2
java·开发语言·python
qq_589666058 小时前
TypeScript 完整入门教程
前端·javascript·typescript
星栈独行10 小时前
翻完 Pi 源码:它和 Codex、Claude Code 有何不同
开发语言·javascript·人工智能·程序人生
qq_4480111610 小时前
C语言中的变量和函数的定义与声明
android·c语言·开发语言
落落Plus11 小时前
浏览器缓存机制详解
javascript·缓存·浏览器缓存
孫治AllenSun11 小时前
【DataX】生产环境搭建DataX集群案例
java·开发语言·jvm
c2385612 小时前
把 C++ 内存分配拆透:new 与 malloc 的三层血缘
开发语言·c++·算法
浅水壁虎13 小时前
vue基础(第二章 )
前端·javascript·vue.js
界面开发小八哥13 小时前
界面控件DevExtreme v26.1新版亮点——支持Angular 22
前端·javascript·angular.js·devexpress·ui开发·devextreme
moonsims13 小时前
星闪在跨域无人化系统作用
开发语言·php