quasar-framework/src/directives/close-overlay.js

Simultaneously build desktop/mobile SPA websites & phone/tablet apps with VueJS

export default {
  name: 'close-overlay',
  bind (el, binding, vnode) {
    const handler = () => {
      let vm = vnode.componentInstance
      while ((vm = vm.$parent)) {
        const name = vm.$options.name
        if (name === 'q-popover' || name === 'q-modal') {
          vm.hide()
          break
        }
      }
    }
    el.__qclose = { handler }
    el.addEventListener('click', handler)
  },
  unbind (el) {
    const ctx = el.__qclose
    if (!ctx) { return }
    el.removeEventListener('click', ctx.handler)
    delete el.__qclose
  }
}