vue 点击其它地方时, 隐藏该组件

直接上代码！

<template>
  <div class="main">
 			<!-- 1.给此组件绑定点击事件 -->
	      <span @click.stop="clickHere" v-if="ifShow">此组件</span>
    </div>
  </div>
</template>
<script>
export default {
  data() {
    return {
      ifShow: false
    };
  },
  methods: {
  
	 // 2.方法
    clickHere() {
      var _this = this;
      this.ifShow= true;      
	 // 3.点击非组件时方法 
      function dnotShow(){
        _this.ifShow= false;
        document.body.removeEventListener('click',dnotShow)
      }
      document.body.addEventListener('click',dnotShow);
    }
  }
};
</script>