資訊專欄INFORMATION COLUMN
摘要：前言想必前端小伙伴都遇到過一個(gè)問題點(diǎn)擊某個(gè)按鈕時(shí)如果點(diǎn)擊的比較快，可能會(huì)觸發(fā)多次。接下來為大家介紹幾種防止重復(fù)點(diǎn)擊的小妙招。這個(gè)是網(wǎng)站必備的裝逼特效，既能告訴用戶系統(tǒng)已經(jīng)在幫用戶搞事情了，又可以防止用戶在此期間做其他操作。
前言：想必前端小伙伴都遇到過一個(gè)問題：點(diǎn)擊某個(gè)按鈕時(shí)如果點(diǎn)擊的比較快，可能會(huì)觸發(fā)多次。如果查詢操作影響還不大，如果是提交操作，那就會(huì)有問題了。接下來為大家介紹幾種防止重復(fù)點(diǎn)擊的小妙招。
基礎(chǔ)：給請(qǐng)求添加loading效果。這個(gè)是網(wǎng)站必備的裝逼特效，既能告訴用戶系統(tǒng)已經(jīng)在幫用戶搞事情了，又可以防止用戶在此期間做其他操作。
進(jìn)階(方法1)： 使用防抖。防抖: 在一定時(shí)間內(nèi)，動(dòng)作只會(huì)執(zhí)行一次（大家可以使用loadsh的debounce方法，也可以自己寫）。舉個(gè)例子：我在網(wǎng)上買了很多東西，今天很多快遞都會(huì)到，時(shí)不時(shí)的就會(huì)有快遞小哥的電話，我不想來回去取快遞，就每隔1個(gè)小時(shí)取一次，如果1個(gè)小時(shí)內(nèi)沒有快遞，就不下樓拿快遞了。
建議：第一次點(diǎn)擊立即執(zhí)行，后面的點(diǎn)擊每隔一段時(shí)間執(zhí)行一次。（debounce的leading設(shè)置為true）
進(jìn)階（方法2）：變量控制。 如果按鈕和事件處理在一個(gè)組件中，那么我們可以使用變量來控制，以react為例：
建議使用防抖的方式，寫法簡單，可維護(hù)性高。如果您還有其他比較好的方法，歡迎留言。
過幾天會(huì)寫防抖的文章，歡迎關(guān)注。
文章版權(quán)歸作者所有，未經(jīng)允許請(qǐng)勿轉(zhuǎn)載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。
轉(zhuǎn)載請(qǐng)注明本文地址：http://m.hztianpu.com/yun/105070.html
摘要：利用處理重復(fù)點(diǎn)擊響應(yīng)式地處理按鈕點(diǎn)擊，利用的操作符，來防止重復(fù)點(diǎn)擊，相較于第方案來說，此方法更為優(yōu)雅一些。 版權(quán)聲明：本文已授權(quán)微信公眾號(hào)：Android必修課，轉(zhuǎn)載請(qǐng)申明出處 App中，有很大一部分場(chǎng)景是點(diǎn)擊按鈕，向服務(wù)端提交數(shù)據(jù)，由于網(wǎng)絡(luò)請(qǐng)求需要時(shí)間，用戶很可能會(huì)多次點(diǎn)擊，造成數(shù)據(jù)重復(fù)提交，造成各種莫名其妙的問題。因此，防止按鈕多次點(diǎn)擊，是Android開發(fā)中一個(gè)很重要的技術(shù)手...
摘要：避免與進(jìn)行比較避免推薦與進(jìn)行比較的代碼，可以用以下技術(shù)進(jìn)行替換如果值是一個(gè)應(yīng)用類型，使用操作符，檢查其構(gòu)造函數(shù)如果值是基本類型，使用檢查其類型如果是希望對(duì)象包含某個(gè)特定的方法名，則只用操作符確保指定名字的方法存在于對(duì)象上。 持續(xù)更新地址 https://wdd.js.org/js-best-pr... 1. 風(fēng)格 一千個(gè)讀者有一千個(gè)哈姆雷特，每個(gè)人都有自己的code style。...
閱讀 1156·2021-11-22 14:56
閱讀 1618·2019-08-30 15:55
閱讀 3449·2019-08-30 15:45
閱讀 1713·2019-08-30 13:03
閱讀 2937·2019-08-29 18:47
閱讀 3404·2019-08-29 11:09
閱讀 2718·2019-08-26 18:36
閱讀 2666·2019-08-26 13:55
