中文字幕日韩精品一区二区免费_精品一区二区三区国产精品无卡在_国精品无码专区一区二区三区_国产αv三级中文在线

微信小程序如何避免按鈕多次點(diǎn)擊重復(fù)觸發(fā)事件

2023-03-08    分類: 微信小程序

?比如頁(yè)面有一個(gè)form表單,快速重復(fù)點(diǎn)擊兩次提交按鈕,你會(huì)發(fā)現(xiàn)提交了數(shù)據(jù)兩次,這種現(xiàn)象在正常情況下不會(huì)發(fā)生,只有當(dāng)網(wǎng)絡(luò)非常不好或者手機(jī)設(shè)備實(shí)在太差的時(shí)候才會(huì)發(fā)生。當(dāng)作為一個(gè)嚴(yán)謹(jǐn)好的應(yīng)用,這種情況是不應(yīng)該發(fā)生,那么如何避免按鈕多次點(diǎn)擊重復(fù)觸發(fā)事件呢?創(chuàng)新互聯(lián)參考微信小程序開(kāi)發(fā)文檔以及網(wǎng)絡(luò)搜索找到了如下幾個(gè)方法:
方法一、解決問(wèn)題主要思路是當(dāng)按鈕被第一次點(diǎn)擊時(shí),設(shè)置按鈕disabled屬性為true,從而避免被再次點(diǎn)擊。方法解決步驟如下:
1、增加頁(yè)面data參數(shù)disabled,這個(gè)參數(shù)名可自己隨意定義,設(shè)置初始值為false;
2、頁(yè)面綁定按鈕disabled屬性,具體代碼片段發(fā)布;
3、當(dāng)事件執(zhí)行開(kāi)始時(shí),加入代碼 this.setData({disabled:true}),就是設(shè)置按鈕為不可用;
4、事件執(zhí)行完畢,重新初始化按鈕disabled屬性,有兩種情況: 如果事件執(zhí)行完頁(yè)面發(fā)生跳轉(zhuǎn)如navigateTo 當(dāng)返回的時(shí)候,你會(huì)發(fā)覺(jué)按鈕不可用,這時(shí)候
需要在onShow事件加入代碼
onShow:function() {
this.setData({disabled:false})
}
如果頁(yè)面不需要跳轉(zhuǎn),直接在事件執(zhí)行完畢的時(shí)候加入this.setData({disabled:false})
這時(shí)候你會(huì)問(wèn),為什么不都在事件執(zhí)行完畢時(shí)候設(shè)置disabled為false.當(dāng)頁(yè)面發(fā)生跳轉(zhuǎn)的時(shí)候不好用,我自己測(cè)試過(guò)。
方法二、通過(guò)設(shè)置遮罩層,當(dāng)按鈕被第一次點(diǎn)擊的時(shí)候,彈出一個(gè)遮罩層遮擋按鈕被再次點(diǎn)擊,這種方法需要自己定義一個(gè)遮罩層,可通過(guò)一個(gè)data屬性來(lái)控制是否顯示,具體執(zhí)行步驟和方法一類似。
方法三、不通過(guò)遮罩層和按鈕disable屬性,直接通過(guò)變量來(lái)控制是否執(zhí)行事件,具體代碼大致如下:
1、設(shè)置參數(shù)is_first_action為true
2、事件執(zhí)行前設(shè)置is_first_action為false,然后執(zhí)行事件時(shí)判斷is_first_action是否為true,否則不執(zhí)行
3、執(zhí)行完初始化is_first_action為true
以上三種方法相同點(diǎn)都是通過(guò)data屬性來(lái)判斷是非是第一次執(zhí)行,不同點(diǎn)在于界面展示,其中第一種可能只適合按鈕,而第二種和第三種方法適合圖片或者文字觸發(fā)的事件。
還有一種特別的重復(fù)觸發(fā)情況時(shí),當(dāng)按鈕需要定義單擊、雙擊和長(zhǎng)按事件時(shí),單擊、雙擊和長(zhǎng)按是三種不同的事件,雖然小程序通過(guò)兩個(gè)事件參數(shù)執(zhí)行不同事件,但是有個(gè)BUG就是當(dāng)雙擊和長(zhǎng)按的時(shí)候都會(huì)觸發(fā)單擊事件。如何解決這個(gè)問(wèn)題可參考創(chuàng)新互聯(lián)的文章《微信小程序點(diǎn)擊事件重復(fù)觸發(fā)如何解決》
微信小程序發(fā)布一年多以來(lái),說(shuō)實(shí)話,BUG還是挺多的,不過(guò)修補(bǔ)也很積極,經(jīng)常深更半夜更新新的功能或者修復(fù)BUG,這點(diǎn)還是值得學(xué)習(xí)的。

當(dāng)前題目:微信小程序如何避免按鈕多次點(diǎn)擊重復(fù)觸發(fā)事件
當(dāng)前鏈接:http://m.rwnh.cn/news/242589.html

網(wǎng)站建設(shè)、網(wǎng)絡(luò)推廣公司-創(chuàng)新互聯(lián),是專注品牌與效果的網(wǎng)站制作,網(wǎng)絡(luò)營(yíng)銷seo公司;服務(wù)項(xiàng)目有微信小程序

廣告

聲明:本網(wǎng)站發(fā)布的內(nèi)容(圖片、視頻和文字)以用戶投稿、用戶轉(zhuǎn)載內(nèi)容為主,如果涉及侵權(quán)請(qǐng)盡快告知,我們將會(huì)在第一時(shí)間刪除。文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng),如需處理請(qǐng)聯(lián)系客服。電話:028-86922220;郵箱:631063699@qq.com。內(nèi)容未經(jīng)允許不得轉(zhuǎn)載,或轉(zhuǎn)載時(shí)需注明來(lái)源: 創(chuàng)新互聯(lián)

h5響應(yīng)式網(wǎng)站建設(shè)
体育| 邳州市| 临猗县| 大同县| 南充市| 右玉县| 太白县| 五河县| 于都县| 邢台县| 博野县| 望都县| 连江县| 屏边| 比如县| 铜山县| 东乡族自治县| 仁化县| 高要市| 弋阳县| 襄垣县| 德州市| 寿阳县| 贵溪市| 乌拉特后旗| 鄯善县| 达州市| 陆川县| 龙口市| 江川县| 吴旗县| 察隅县| 报价| 乐陵市| 枝江市| 泰兴市| 个旧市| 湘乡市| 霍林郭勒市| 贡嘎县| 永和县|