Questions tagged [vuedraggable]

With vuedraggable you can create drag-and-drop sortable lists that sync with Vue's view model array. It's based on Sortable.js and has all it's features.

Documentation and code is available at: https://github.com/SortableJS/Vue.Draggable

178 questions
11
votes
2 answers

how to use autoscroll feature vue-draggable

I'm trying to use vue-draggable (https://github.com/SortableJS/Vue.Draggable) for a large list of nested items (an organisational tree). Since there is a lot of data, the user will need to be able to scroll while dragging. All options from…
Katinka Hesselink
  • 3,961
  • 4
  • 20
  • 26
9
votes
2 answers

Nuxt + Vuetify + VueDraggable - draggable tag prop, v-row, works in dev server but not after building/running for production

I'm building a Nuxt app with Vuetify buildModule setup and want to make a number of v-cols sortable via VueDraggable (in my case, I built and added a super small Nuxt plugin which binds a global draggable component from the default export from…
Lance Whatley
  • 2,395
  • 1
  • 13
  • 16
6
votes
1 answer

vue-draggable not able to disable

I wrote a component that is shared throughout my application, in some places I need the dragging/sorting and some do not want it there. I pass a prop to my component called disableDraggable and based on that it should disable, unfortunately it does…
Michael
  • 4,538
  • 5
  • 31
  • 58
5
votes
4 answers

SortableJS / Vue.Draggable multi-drag option not working

Recently I have discovered that the SortableJS / Vue.Draggable library (https://github.com/SortableJS/Vue.Draggable) has a new option where multi-drag can be enabled to select multiple elements from an array and move them together…
Juan C. Vidal
  • 53
  • 1
  • 5
5
votes
1 answer

How to use Vue.Draggable CDN without webpack?

I’m a newbie on Vue. One of the pages (salesview) on my client’s CodeIgniter website needs to use Vue so I included it by and I declared Vue and its components in a file called salesview.js.…
Esthon Wood
  • 315
  • 3
  • 19
4
votes
1 answer

Implementing Vue draggable with cards?

I am trying to implement vuedraggable with Vuetify Cards but for some reason the drag and drop doesn't work when the cards are in a single row but works when they are in a column. Check out this working CodeSandbox. In the Parent.vue file, if i…
Somethingwhatever
  • 1,390
  • 4
  • 32
  • 58
4
votes
2 answers

VueJS + Vue.Draggable + Vuex Store + Computed Variables

Is there a way to use Vue.Draggable lists with computed variables in a Vuex Store? I'm fairly new to VueJS and this is my current component setup: // Template
4
votes
3 answers

How to keep dragging item at former position until release in vue draggable

I'm implementing a nested layers component in vue with vuedraggable. I try to keep it close to Adobe's layers panel (for example in Illustrator). The desired behaviour is: While dragging an item, it remains at it's position and only a black line is…
Arnoson
  • 71
  • 1
  • 6
3
votes
1 answer

how to get vue draggable moved item

I am using this to implement drag-drop in my vue app. Lets my array is: lists: [ { id: 1, name: 'Item 1' }, { id: 2, name: 'Item 2' }, { id: 3, name: 'Item 3' }, ] I want to get the element object from the list after finishing the drop…
user1896653
  • 3,247
  • 14
  • 49
  • 93
3
votes
1 answer

How to trigger only one button with vuedraggable?

I am implementing table draggable with vue. However, what I want is to trigger only the column button on the v-icon, but when all the rows are pressed, all triggers. How can I limit the draggable to only certain columns?
김정수
  • 611
  • 4
  • 9
  • 22
3
votes
1 answer

vuedraggable works with :list, not v-model with Vue3 composition API

I have this Vue3 component using composition API: