vue-drager怎么使用

Vue-drager是一个基于Vue.js的拖拽组件。使用vue-drager可以轻松实现拖拽功能。

1. 安装vue-drager

可以使用npm来安装vue-drager：

npm install vue-drager --save

2. 在Vue中引入vue-drager

在需要使用vue-drager的组件中，引入vue-drager：

import Drager from 'vue-drager'

3. 在template中使用vue-drager

在template中使用vue-drager，可以这样写：

<drager @dragging="onDragging" @dragend="onDragend">
  <div class="box"></div>
</drager>

其中，@dragging和@dragend是vue-drager提供的事件。onDragging和onDragend是事件处理函数，可以在组件中定义。

4. 添加拖拽事件处理函数

在组件中添加事件处理函数：

methods: {
  onDragging (e) {
    console.log('dragging', e)
  },
  onDragend (e) {
    console.log('dragend', e)
  }
}

5. 自定义样式

可以自定义拖拽时的样式，比如改变鼠标指针的样式：

.drager {
  cursor: move;
}

以上就是使用vue-drager实现拖拽功能的基本步骤。