fix: 支付防抖

src/main.js

@@ -16,7 +16,6 @@ app.$mount();
 import { createSSRApp } from "vue";
 import * as Pinia from "pinia";
 import { createUnistorage } from "pinia-plugin-unistorage";
-import noclick from "./utils/noclick";
 
 export function createApp() {
   const app = createSSRApp(App);
@@ -25,7 +24,6 @@ export function createApp() {
   pinia.use(createUnistorage());
   app.use(pinia);
   app.use(share);
-  app.use(noclick);
 
   return {
     app,

src/pages-booking/components/FooterSection/index.vue

@@ -29,6 +29,7 @@
 
 <script setup>
 import { computed, defineProps, defineEmits } from "vue";
+import { DebounceUtils } from "@/utils";
 
 const props = defineProps({
   modelValue: {
@@ -59,9 +60,9 @@ const totalAmt = computed(() => {
   return count.value * Number(specificationPrice) * totalDays;
 });
 
-const handleBooking = () => {
+const handleBooking = DebounceUtils.createDebounce(() => {
   emit("payClick", props.orderData);
-};  
+}, 1000); 
 
 </script>
 

src/pages-order/order/components/FooterSection/index.vue

@@ -27,6 +27,7 @@
 <script setup>
 import { defineProps, defineEmits, computed } from "vue";
 import { orderPayNow } from "@/request/api/OrderApi";
+import { DebounceUtils } from "@/utils";
 
 const props = defineProps({
   orderData: {
@@ -64,7 +65,7 @@ const buttonText = computed(() => {
 const emit = defineEmits(["refund", "refresh"]);
 
 // 处理按钮点击事件
-const handleButtonClick = async (orderData) => {
+const handleButtonClick = DebounceUtils.createDebounce(async (orderData) => {
   try {
     // 再次预定跳转商品详情
     if (["1", "2", "3", "4", "5", "6"].includes(statusCode.value)) {
@@ -130,7 +131,7 @@ const handleButtonClick = async (orderData) => {
     console.error("操作失败:", error);
     uni.hideLoading();
   }
-};
+}, 1000);
 </script>
 
 <style lang="scss" scoped>

src/utils/noclick.js

@@ -1,28 +0,0 @@
-// 防止处理多次点击
-// methods是需要点击后需要执行的函数， info是点击需要传的参数
-export function noMultipleClicks(fn, info, delay = 2000) {
-  if (typeof fn !== 'function') return;
-  // this 会是组件实例（因为通过 globalProperties 调用时 Vue 会把组件实例作为上下文）
-  const ctx = this || {};
-  if (!ctx.__noClickMap) ctx.__noClickMap = new WeakMap();
-
-  const map = ctx.__noClickMap;
-  if (map.get(fn)) {
-    console.log('请勿重复点击:', fn.name);
-    return;
-  }
-
-  map.set(fn, true);
-  // 保留组件上下文调用方法
-  fn.call(ctx, info);
-
-  setTimeout(() => {
-    map.set(fn, false);
-  }, delay);
-}
-
-export default {
-  install(app) {
-    app.config.globalProperties.$noMultipleClicks = noMultipleClicks;
-  }
-}