[SOLVED] Error in directive dragula update hook: "TypeError: Cannot read property 'drake' of undefined"

Error in directive dragula update hook: "TypeError: Cannot read property 'drake' of undefined"

I used vue-dragula in my project for the drag & drop list requirement.

It's worked perfect. But I have the below error at that hold element remove time.

Error in directive dragula update hook: "TypeError: Cannot read property 'drake' of undefined"

My code sample below

(template HTML code)

<ul v-dragula="dragDatas" bag="action-bag">
    <li v-for="(drDatas, drIndex) in dragDatas" :key="drDatas.id">{{drDatas.name}}</li>
</ul>

(Script code)

import 'vue-dragula/styles/dragula.css';

created () {
  Vue.vueDragula.options('action-bag', {
    invalid: function (el, handle) {
      return // CONDITION BASED
    }
  });
},

mounted () {
  const self = this;
  Vue.vueDragula.eventBus.$on('drop', async function ([bag, curElmt, allElmts]) {
    // drop event based functionalities
  })
}

Solution

I fixed this issue with hide and show the parent component.