[Vuejs]-FIre event on toggle of v-show

0๐Ÿ‘

You can use a watcher:

watch: {
    gallery: {
        handler: value => {
            this.$emit('gallery-toggled', value)
        }
    }
}

or a computed:

 computed: {
    toggle () {
         this.$emit('gallery-toggled', this.gallery)
    }
  }

0๐Ÿ‘

If you want to do something after the view has updated (i.e the component is actually visible or hidden), you may have to wrap the $emit in nextTick(), see Vue.nextTick( [callback, context] ).

It depends on the exact order of updating the watch or computed, but if you are getting unexpected results in the receiver of the event, this is an option to try.

See the discussion here.

this.$nextTick(function() { 
  this.$emit('galleryVisible', this.gallery) 
});

Leave a comment