Browse Source

封装防止重复点击

lijuncheng0816
wangyufei 3 months ago
parent
commit
e9ed633dd0
  1. 21
      src/common/noclick.js
  2. 1
      src/main.js
  3. 5
      src/pages/issue/record/directIssue.vue
  4. 2
      src/pages/package/record/splitPackageRecord.vue

21
src/common/noclick.js

@ -11,15 +11,34 @@ function noMultipleClicks(methods, info) {
} else {
methods();
}
setTimeout(()=> {
let timer = setTimeout(()=> {
that.noClick= true;
clearTimeout(timer)
}, 2000)
} else {
// 这里是重复点击的判断
}
}
// 节流函数
const throttle = (fn, t,_this) => {
console.log('throttle')
return ()=> {
if (!_this.timer) {
_this.timer = setTimeout(()=>{
fn()
console.log('fn')
//·清空定时器
_this.timer = null
}, t)
}
}
}
//导出
export default {
noMultipleClicks,//禁止多次点击
throttle
}

1
src/main.js

@ -36,6 +36,7 @@ export function createApp() {
app.use(uView)
app.component('comMessage', comMessage)
app.config.globalProperties.$noMultipleClicks = noclick.noMultipleClicks;
app.config.globalProperties.$throttle = noclick.throttle;
// startApp(app);
return {
app,

5
src/pages/issue/record/directIssue.vue

@ -5,10 +5,9 @@
</view>
<view class="page-wraper" v-if="detailSource.length>0">
<view class="page-header">
<view class="header_item">
来源库位 : {{fromLocationCode}}
<view class="header-view header_item">
来源库位 : {{fromLocationCode}}
</view>
<view class='split_line'></view>
</view>
<view class="page-main">
<scroll-view scroll-y="true" class="page-main-scroll">

2
src/pages/package/record/splitPackageRecord.vue

@ -30,7 +30,7 @@
<view class="">
</view>
<view class=" uni-flex uni-row">
<button class="btn_single_commit" hover-class="btn_commit_after" @click="commit">提交</button>
<button class="btn_single_commit" hover-class="btn_commit_after" @click="$throttle(commit,2000,this)()">提交</button>
</view>
</view>
</view>

Loading…
Cancel
Save