vue3 自定义指令 v-click-outside

export default function registerDirectives(app: App) {
  app.directive('click-outside', {
    mounted(el: any, bindings: any) {
      el.handler = function (e: any) {
        if (!el.contains(e.target)) {
          bindings.value(e)
        }
      }
      document.addEventListener('click', el.handler, true)
    },
    unmounted(el: any) {
      document.removeEventListener('click', el.handler)
    }
  })
}

使用方法

<div v-click-outside="hideOutside"></div>

const hideOutside = () => {}