移动端上下拖动调整顺序效果_vue实现移动端拖动排序

本文实例为大家分享了vue实现移动端拖动排序的具体代码，供大家参考，具体内容如下

效果

代码：

class="childDiv"

v-for="(option,index) in options"

:key="index"

>

{ {option}}

export default {

name: "touchMove",

data() {

return {

options: ['选项1', '选项2', '选项3', '选项4'],

columns: undefined,

flags: false,

position: {x: 0, y: 0},

nx: '', ny: '', dx: '', dy: '', xPum: '', yPum: '',

}

},

mounted() {

this.columns = document.querySelectorAll('#child');

let num = 0;