vue.js (vue.js)vue下拉框如何点击其他区域收起

关于网友提出的“vue.js (vue.js)vue下拉框如何点击其他区域收起
”问题疑问，本网通过在网上对“vue.js (vue.js)vue下拉框如何点击其他区域收起
”有关的相关答案进行了整理，供用户进行参考，详细问题解答如下：

问题：vue.js (vue.js)vue下拉框如何点击其他区域收起
描述:

一个下拉组件，如图，想要点击除这个组件的任何其他区域收起这个菜单，vue该怎么做？

---

解决方案1:

1.弹出框v-if="isShow"判断
2.单击时@click="doClick()"
事件:默认(初始化)isShow为false,单击时isShow=!isShow

解决方案2:

这个下拉框是个div或其他什么吧，应该有个用于展示的class吧，这个class应当对应data里面的一个数据吧，修改对应的这个数据不就行了。

解决方案3:

ready() {
   document.addEventListener('click', (e) => {
       if (!this.$el.contains(e.target)) this.show = false
   })
}