//自定义事件 Vue.directive('clickoutside', { bind (el:any, binding:any) { function documentHandler (e:any) { if (el.contains(e.target)) { return false; } if (binding.expression) { binding.value(e); } } el.__vueClickOutside__ = documentHandler; document.addEventListener('click', documentHandler); }, unbind (el:any) { document.removeEventListener('click', el.__vueClickOutside__); delete el.__vueClickOutside__; } });
//使用
<div class="filter-select-down" v-clickoutside="handleClose">
<div :visible="visible">
</div>
</div>
....
handleClose() { this.visible = false; }