@janff/vue-directive-hover

Usage

<template>
<div id="app">
	<div class="select" :class="{hide: !isHover}" v-hover="isHover">
		<div>Please Select</div>
		<ul class="dropdown">
			<li @click="isHover=false">aa</li>
			<li @click="isHover=false">bb</li>
		</ul>
	</div>

	<div class="select" :class="{hide: !test.hover}" v-hover="test.hover">
		<div>Please Select</div>
		<ul class="dropdown">
			<li @click="test.hover=false">aa</li>
			<li @click="test.hover=false">bb</li>
		</ul>
	</div>
</div>
</template>

<script>
export default {
	name: 'TestIndex',
	data(){
		return {
			isHover: false,
			test: {
				hover: false
			}
		}
	},
	watch: {
		isHover(v){
			console.log(v);
		}
	}
}
</script>