vue3-sortable v0.1.1
vue3-sortable
Minimal, kind-of opinionated, Vue 3 sortable list component.
Developed for Pigments app.
Check out the demo folder.
Slots
#item - Receives the v-for directive item as a prop.
Props
modelValue
Type: Array
Required: true
The list of items that need to be sorted.
direction
Type: String
Required: false
Default: vertical
Values: vertical, horizontal
The direction of the sortable.
handle
Type: String
Required: false
Default: null
CSS class selector used as a drag handle. If the handle is not provided, the item can be moved from anywhere.
itemClass
Type: String
Required: false
Default: null
CSS class applied to the items.
animationDuration
Type: Number
Required: false
Default: 200
Reorder animation duration, in ms.
animationEasing
Type: String
Required: false
Default: ease
Reorder animation easing, any CSS transition accepted.
autosScrollEnabled
Type: Boolean
Required: false
Default: true
Whether to auto-scroll when near the edges of the list, when overflow is present.
disabled
Type: Boolean
Required: false
Default: true
Disable the sortable.
Emits
update:modelValue
drag-start
Parameters:
- index - The initial index of the dragged element.
drag-end
- oldIndex - The initial index of the dragged element.
- newIndex - The final index of the dragged element.
- value - The reordered list.
index-change
Triggers when the dragged item index changes.
- oldIndex - The initial index of the dragged element.
- newIndex - The final index of the dragged element.