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);
}
相关推荐
快乐非自愿10 分钟前
常用设计模式:工厂方法模式
javascript·设计模式·工厂方法模式
国服第二切图仔37 分钟前
Rust开发之Trait 定义通用行为——实现形状面积计算系统
开发语言·网络·rust
mjhcsp38 分钟前
C++ 循环结构:控制程序重复执行的核心机制
开发语言·c++·算法
A阳俊yi41 分钟前
Spring Data JPA
java·开发语言
十年磨一剑~44 分钟前
html+js开发一个测试工具
javascript·css·html
csbysj202044 分钟前
CSS 对齐
开发语言
爱吃巧克力的程序媛1 小时前
将qt界面中加载css或者qss样式
开发语言·css·qt
njxiejing1 小时前
Python进度条工具tqdm的安装与使用
开发语言·python
张np1 小时前
java基础-集合接口(Collection)
java·开发语言