Orion Drag'n Drop

La fonctionnalité de drag'n drop consiste en une combinaison de deux composants.

<o-droppable> est utilisé pour créer la zone de drop.

Il doit être combiné avec le composant <o-draggable>, qui sera un sous-composant et qui peut être glissé dans les différentes zones de drop.

Vous pouvez jetez un oeil aux exemples de code ci-dessous pour vous faire une meilleure idée de ce mécanisme.

DragNDropPlayground DroppableValidation

OrionDroppable

Props

Name
datalistDataListItem[] = null
tagstring = 'div'
validationOrion.DndValidation = null

Events

Name
Payload type
dropIn
any
dragOver
No payload
dragLeave
No payload
reorder
any
dropOut
any
update:datalist
any[]

Slots

Name
Bindings
default
No bindings

PublicInstance

Name
Type
uid
number
_el
(() => HTMLElement | undefined) | undefined

Provide

Name
Type
_droppable
publicInstance

OrionDraggable

Props

Name
dataObject = null
disabledboolean = false
tagstring = 'div'

Events

Name
Payload type
update:disabled
boolean

Slots

Name
Bindings
default
No bindings