Vue.js 下拉框组件当点击菜单栏外的时候关闭菜单 作者: Shine 时间: 2021-08-23 分类: Vue.js,JavaScript ## Menu.vue > 菜单组件 >  ``` <template> <div class="menu" v-if="show"> <!--假设是菜单组件......--> </div> </template> <script> export default { data(){ return { show: true,//是否显示菜单 } }, mounted() { // 在这里加上就可以了 document.addEventListener('click', (e) => { // 如果当前组件(菜单组件)的 DOM “不包含” 当前点击的 DOM // 就关闭显示菜单 if (!this.$el.contains(e.target)) this.show = false }) } } </script> ``` 标签: Vue.js, 组件