diff --git a/src/main.js b/src/main.js index aac440f..6c81070 100644 --- a/src/main.js +++ b/src/main.js @@ -16,6 +16,8 @@ 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); const pinia = Pinia.createPinia(); @@ -23,10 +25,11 @@ export function createApp() { pinia.use(createUnistorage()); app.use(pinia); app.use(share); + app.use(noclick); return { app, pinia, }; } -// #endif +// #endif \ No newline at end of file diff --git a/src/pages-booking/components/FooterSection/index.vue b/src/pages-booking/components/FooterSection/index.vue index b015599..10d32e0 100644 --- a/src/pages-booking/components/FooterSection/index.vue +++ b/src/pages-booking/components/FooterSection/index.vue @@ -21,7 +21,7 @@ /> 立即支付 diff --git a/src/pages-order/order/components/FooterSection/index.vue b/src/pages-order/order/components/FooterSection/index.vue index 3ccf7a0..84878a3 100644 --- a/src/pages-order/order/components/FooterSection/index.vue +++ b/src/pages-order/order/components/FooterSection/index.vue @@ -17,7 +17,7 @@ 'bg-2D91FF': ['1', '2', '3', '4', '5', '6'].includes(statusCode), }, ]" - @click="handleButtonClick(orderData)" + @click="$onmultipleClicks(() => handleButtonClick(orderData))" > {{ buttonText }} diff --git a/src/utils/noclick.js b/src/utils/noclick.js new file mode 100644 index 0000000..bef2968 --- /dev/null +++ b/src/utils/noclick.js @@ -0,0 +1,28 @@ +// 防止处理多次点击 +// 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; + } +}