Package Exports
- v-click-outside
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 (v-click-outside) to support the "exports" field. If that is not possible, create a JSPM override to customize the exports field for this package.
Readme
v-click-outside
Vue directive to react on clicks outside an element without stopping the event propagation. Great for closing dialogues, menus among other things.
Install
$ npm install --save v-click-outside$ yarn add v-click-outsideUse
import Vue from 'vue'
import vClickOutside from 'v-click-outside'
Vue.use(vClickOutside)<script>
export default {
methods: {
onClickOutside (event) {
console.log('Clicked outside. Event: ', event)
}
}
};
</script>
<template>
<div v-click-outside="onClickOutside"></div>
</template>Or use it as a directive
import vClickOutside from 'v-click-outside'
<script>
export default {
directives: {
clickOutside: vClickOutside.directive
},
methods: {
onClickOutside (event) {
console.log('Clicked outside. Event: ', event)
}
}
};
</script>
<template>
<div v-click-outside="onClickOutside"></div>
</template>On touch devices, the plugin adds 'touchstart' and 'click' event listeners to support laptops with touch screen. Use 'notouch' modifier, to avoid 'click' event to be fired.
<template>
<div v-click-outside.notouch="onClickOutside"></div>
</template>License
Style
