feat(custom): 大转盘第一版

src/components/Popup.vue

@@ -2,6 +2,7 @@
 import { ref } from "vue";
 import Taro from "@tarojs/taro";
 import { userSign } from "@/api/user";
+import { debounce } from "@/utils";
 
 const show = ref(false);
 
@@ -32,7 +33,7 @@ const toSign = async () => {
     :close-on-click-overlay="false"
   >
     <view class="wrapper">
-      <view @click.stop="toSign">
+      <view @click.stop="debounce(toSign)">
         <image class="image" src="../static/index/poppBg.png" />
       </view>
       <view @click.stop="show = false">

src/utils/index.ts

@@ -53,3 +53,44 @@ export function parseQueryString(url: string) {
 
   return result;
 }
+
+/**
+ *
+ * @param rdix 随机因子
+ * @param length 取的长度
+ * @param isAddStr 是否限制随机结果中的长度,不允许输出长度
+ * @returns String
+ */
+export function getUid(rdix = 1, length = 12, isAddStr = false) {
+  return Math.floor(
+    Math.random() * rdix * Math.floor(Math.random() * Date.now())
+  )
+    .toString(isAddStr ? 16 : 10)
+    .substring(0, length);
+}
+
+/*
+防抖
+防抖原理：在一定时间内，只有最后一次操作，再过wait毫秒后才执行函数
+	@param {Function} func 要执行的回调函数
+	@param {Number} wait 延迟的时间
+	@param{Boolean} immediate 是否要立即执行
+*/
+var timeout: any = getUid(1);
+export function debounce(func: Function, wait = 500, immediate = false) {
+  // 清除定时器
+  if (timeout !== null) clearTimeout(timeout);
+  // 立即执行，此类情况一般用不到
+  if (immediate) {
+    timeout = setTimeout(() => {
+      timeout = null;
+    }, wait);
+    typeof func === "function" && func();
+  } else {
+    // 设置定时器，当最后一次操作后，timeout不会再被清除，所以在延时wait毫秒后执行func回调方法
+    timeout = getUid(1);
+    timeout = setTimeout(() => {
+      typeof func === "function" && func();
+    }, wait);
+  }
+}