<template>
  <draggable :element="'ul'" :list="tasks" :move="checkMoveSub" :options="{ group: { name: 'cards' }}"> 
      <li v-for="task in tasks" class="task">
        <div>{{ task.name }}</div>
      </li>
  </draggable>
</template>

<script>
import draggable from 'vuedraggable'
export default {
  name: 'localDraggable',
  components: {
    draggable
  },
  props: {
    tasks: {
      type: Array,
      required: true,
      default: () => ({})
    }
  },
  methods: {
    checkMoveSub(event) {
      console.log('Task moved');
    }
  }
}
</script>