Package Exports

vue3-click-away

This package does not declare an exports field, so the exports above have been automatically detected and optimized by JSPM instead. If any package subpath is missing, it is recommended to post an issue to the original package (vue3-click-away) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.

Readme

Vue Click Away

Vue 3.0 Compatible Click Away Directive

Overview

Detect if a click event happened outside of an element. Compatible with Vue 3.x.

Requirements

Vue 3.x

Installation

npm i -s vue3-click-away

yarn add vue3-click-away

Usage

:::tip By default the module exports a directive, you can also use this as a mixin which is documented below. :::

<template>
  <div v-click-away="onClickAway">
    ...
  </div>
</template>

import VueClickAway from "vue3-click-away";
export default {
  directives: {
    ClickAway: VueClickAway,
  },
  methods: {
    onClickAway(event) {
      console.log(event);
    }
  }
}

Mixin

<template>
  <div v-click-away="onClickAway">
    ...
  </div>
</template>

import { mixin as VueClickAway } from "vue3-click-away";
export default {
  mixins: [VueClickAway],
  methods: {
    onClickAway(event) {
      console.log(event);
    }
  }
}