vue实现点击其他地方简单管用

思路很简单，把页面中的其他点击事件阻止一下冒泡，然后点击body的时候正常做你想做的操作就行，超简单

js：

data: function(){
   return {
        show:false
    }
},
mounted () {
    document.addEventListener('click', this.handleBodyClick)
},
destroyed () {
    document.removeEventListener('click', this.handleBodyClick)
},
methods:{
    handleBodyClick: function(){
        if (this.show) {
            this.show = false;
        }
    }
    toggleShow: function(){
        this.show = !this.show
    }
}
           

html：

<div :class="{'show':show}" @click.stop="toggleShow()">
、、、
</div>
           

千万记住区域以内的别的click事件都stop一下阻止冒泡