manusanchev/vue3-clickaway

Vue 3 directive to detect clickaway events

vue3 ClickAway

Vue 3 directive to detect clickaway events

Install

PNPM

pnpm add @manusanchev/vue3-clickaway

Yarn

yarn install @manusanchev/vue3-clickaway

NPM

npm install @manusanchev/vue3-clickaway

Register

Vue 3

import { createApp } from "vue";
import ClickAway from "@manusanchev/vue3-clickaway";
import App from "./App.vue";

const app = createApp(App);
app.use(ClickAway);
app.mount("#app");

Nuxt 3

plugins/clickaway.client.ts

import ClickAway from "@manusanchev/vue3-clickaway";

export default defineNuxtPlugin(nuxtApp => {
  nuxtApp.vueApp.use(ClickAway);
});

Usage

<script setup lang="ts">

function onClickAway() {
  // your code here
}
</script>

<template>
  <div v-clickaway="onClickAway">
    <!-- Content -->
  </div>
</template>