vue-dragula icon indicating copy to clipboard operation
vue-dragula copied to clipboard

2.0 changes

Open Astray-git opened this issue 8 years ago • 0 comments

2.0 Changes

Plugin API

  • rename plugin to Vue.dragula #6
  • install plugin to instance, vm.$dragula #7 #11
  • options set no longer limited in created hook

Model data flow

To follow one-way data flow in Vuejs 2, model value will not be updated automatically on drake events inside the directive. Updated model will be emitted with events.

Using event bus allow us handle events directly in other components. And we need to update models manually.

For "in component" drag&drop we just update model, but for "cross-component" drop&drop(or copy) actions, target and source needs to be update separately. Currently a dropTarget is exposed in event payload:

eventTarget = {
  el: target, // Target element
  model: targetModel, // updated model of target component
  expression: targetExpression // the expression for directive
}

Here's a simple example:

function updateModel (vm, dropTarget, dropSource) {
  vm[dropSource.expression] = dropSource.model
  if (dropTarget.el === dropSource.el) { return }
  vm[dropTarget.expression] = dropTarget.model
}

Please try with the new version and leave feedbacks

Astray-git avatar Dec 17 '16 13:12 Astray-git