双击屏幕两下点赞

<template>  
  <view class="container" @tap="handleTap">  
    <text class="like-text">双击屏幕点赞</text>  
    <text class="like-count">点赞数：{{ likeCount }}</text>  
  </view>  
</template>  
  
<script>  
export default {  
  data() {  
    return {  
      likeCount: 0, // 点赞数  
      tapTimeout: null, // 定时器，用于实现双击效果  
    };  
  },  
  methods: {  
    // 处理点击事件  
    handleTap() {  
      if (this.tapTimeout) {  
        // 如果存在定时器，说明是双击  
        clearTimeout(this.tapTimeout); // 清除定时器  
        this.tapTimeout = null; // 重置定时器  
        this.like(); // 执行点赞逻辑  
      } else {  
        // 否则设置定时器，等待第二次点击  
        this.tapTimeout = setTimeout(() => {  
          this.tapTimeout = null; // 如果在规定时间内没有第二次点击，清除定时器  
        }, 300); // 设置双击的时间间隔为300毫秒  
      }  
    },  
    // 点赞方法  
    like() {  
      this.likeCount++; // 点赞数加1  
      // 这里可以添加发送请求到服务器等逻辑  
      uni.showToast({  
        title: '点赞成功',  
        icon: 'success',  
        duration: 2000  
      });  
    }  
  }  
};  
</script>  
  
<style>  
.container {  
  display: flex;  
  flex-direction: column;  
  align-items: center;  
  justify-content: center;  
  height: 100vh; /* 设置容器高度为视口高度 */  
}  
  
.like-text {  
  font-size: 20px;  
  margin-bottom: 20px;  
}  
  
.like-count {  
  font-size: 16px;  
}  
</style>