Question 1

How to use sortablejs-vue3 with Vuex?

Accepted Answer

Pass the store state as the list prop and manually handle events like @end to update the store using methods like moveItemInArray, as demonstrated in the README. This requires writing custom event handlers for state synchronization.

Question 2

Sortablejs-vue3 or vue.draggable.next for Vue 3?

Accepted Answer

Sortablejs-vue3 is a thinner wrapper that stays close to Sortable.js, avoiding complexity and bugs reported in vue.draggable.next. Choose it for more control and simplicity, but expect manual state management, whereas vue.draggable.next might offer more integrated features but with potential issues.

Question 3

How to add plugins to sortablejs-vue3?

Accepted Answer

Mount the plugin, such as Swap, using SortableJs.mount() before importing the wrapper, as shown in the README. This ensures the plugin is available for use in the options prop, but requires careful setup order.

Question 4

Does sortablejs-vue3 support nested drag-and-drop?

Accepted Answer

Yes, since it's based on Sortable.js which supports nesting. Configure it through the options prop, but you'll need to handle events and data structures for nested lists manually, as the wrapper doesn't provide high-level abstractions for this.

Question 5

How to customize the drag handle in sortablejs-vue3?

Accepted Answer

Use the Sortable.js options prop to set the handle selector, and ensure your item template includes the appropriate elements. The wrapper passes options directly, so refer to Sortable.js documentation for specific handle customization details.

sortablejs-vue3

What is sortablejs-vue3?

Overview

Use Cases

Best For

Related Projects

Found a gem we're missing?

Not Ideal For

Pros & Cons

Pros

Cons

Frequently Asked Questions