Fire event when $emit is complete

Question

I have a parent component that has a child component in it. When a button is clicked in the child, it emits back to the parent:

   clickevent(data){
            this.$emit('back-to-parent', data);

  }

My dilemma is i need to know when emit is finished so i can execute code thats dependent upon it. I tried this:

        clickevent(data){
           this.$emit('back-to-parent', {data, done: () => { 
                 alert('done') 
             } });
       }

But my alert never fires. I tried these but they dont work https://forum.vuejs.org/t/do-something-after-emit-has-finished-successful/10663

How do i execute code after my emit is finished? Thanks

Answer 1

in a parent component:

@back-to-parent="onBackToParent"
...
methods: {
  onBackToParent({ data, done }) {
    // process data
    if (done) {
      done()
    }
  }
}

in a child component:

clickevent(data){
           this.$emit('back-to-parent', {data, done: () => { 
                 alert('done') 
             } });
       }