长按两秒关闭分享遮罩层

src/components/Share/index.vue

@@ -1,8 +1,8 @@
 <template>
     <div class="">
-        <van-overlay :show="show"  @click="$emit('closeShare')" />
+        <van-overlay :show="show" @touchstart="handelTouchstart" @touchmove="handelTouchmove" @touchend="handelTouchend"/>
         <img src="@/assets/images/share/tip.png" alt="" class="tip" v-if="show" @click="$emit('closeShare')">
-        <img src="@/assets/images/share/ai.gif" alt="" class="ai" v-if="show" >
+        <img src="@/assets/images/share/ai.gif" alt="" class="ai" v-if="show">
         <img src="@/assets/images/share/shadow.png" alt="" class="shadow">
     </div>
 </template>
@@ -11,6 +11,12 @@
 
 export default {
     name: 'SvgIcon',
+    data() {
+        return {
+            time: null,
+            flag:false
+        }
+    },
     props: {
         show: {
             type: Boolean,
@@ -19,7 +25,27 @@ export default {
     },
     computed: {
 
+    },
+    methods: {
+        handelTouchstart() {
+            this.flag = true;
+            clearTimeout(this.time)
+            this.time = setTimeout(()=>{
+                if(this.flag){
+                    this.$emit('closeShare')
+                }
+            },1500)
+        },
+        handelTouchmove(){
+            this.flag = false;
+        },
+        handelTouchend(){
+            this.flag = false;
         }
+    },
+    destroyed(){
+        clearInterval(this.time)
+    },
 }
 </script>