Vue3-Drag-Utils

Brief

Experience better drag and drop tools

Features

• Drag move or clone
• Disabled

ToDo

• Multi-select Drag and Drop
• Nested Drag and Drop
• transition

Usage

npm i vue3-drag-utils

// main.js
import { createApp } from 'vue';
import vue3dragutils from 'vue3-drag-utils';
import 'vue3-drag-utils/es/style.css';
const app = createApp(App);
app.use(vue3dragutils);
app.mount('#app');

<!-- App.vue -->
<template>
  <DndProvider>
    <RouterView />
  </DndProvider>
</template>

<!-- Example.vue -->
<template>
  <draggable
    v-model:list="list"
  >
    <template #item="{ data, index }">
      <div>{{ data.name }}</div>
    </template>
  </draggable>
</template>

Develop

git clone https://github.com/vue-drag/vue3-drag-utils
cd packages/vue3-drag-utils
# Do some development
npm run build

License

MIT

Repository

https://github.com/vue-drag/vue3-drag-utils