vue-clickoutside

A Vue directive about listener a click outside an element.
9,169 10
vue click directive outside
Install
npm install vue-clickoutside
Latest Version:0.2.0
Vue:1
License:MIT
Last Updated:Oct 10, 2016
Links: GitHub  ·  npm
Maintainer: qingwei.li

vue-clickoutside

make a click outside event.

Similar vue-clickaway, but more simpler. :P

Installation

npm i vue-clickoutside -D

Demo

demo gif

Quick Start

import Vue from 'vue'
import VueClickoutside from 'vue-clickoutside'

Vue.use(VueClickoutside)

// or custom directive id
Vue.directive('v-clickoutside', VueClickoutside)

<div v-clickoutside="show = false" class="box">
  <button @click="show = true">click me</button>
  <div v-show="show">dropdown</div>
</div>

Development

If you using NPM 3.x, these will not be automatically installed.

  • jasmine-core *
  • phantomjs-prebuilt ^1.9

License

MIT

Related Packages

v-click-outside-x

Vue directive to react on clicks outside an element.

792,715 7
click directive outside vue
v3-click-outside

Vue3 directive to react on clicks outside an element. Its simple to use. And can...

22,256 4
click directive outside vue3
vue-outside-click

Directive for VueJS, handle click outside target element

5,228 1
click directive outside vue
vue-click-outside-of

Vue 3 directive and hook for detecting click outside an element

18,967 1
click directive outside vue click outside hook vue3
vue-click-helper

A Vue directive to distinguish between click and double click

3,059 10
click directive vue dblclick double click

Version History

Version Released Vue License
0.2.0 ^1.0.21 MIT
0.1.0 ^1.0.21 MIT
0.0.4 ^1.0.21 MIT
0.0.3 ^1.0.21 MIT
0.0.2 ^1.0.21 MIT