layer.confirm快速點擊會重複觸發事件問題

layer.confirm快速點擊會重複觸發事件問題
1 .問題描述: 快速點擊會出現,重複觸發事件,像後臺發起多次請求,此時後臺極端=短時間內多次請求,會出現併發問題,數據髒讀
在這裏插入圖片描述

2.問題分析 :查看layerUI的API發現,系統的confirm是線程阻塞的,而layer.confirm是非阻塞的

在這裏插入圖片描述

3.問題解決
方案1. 防止重複觸發事件,前臺js加鎖
方案2.後臺代碼加樂觀鎖
此時,方案1解決這個問題最佳
4.具體實現:

 //出庫
   output: function () {
            console.log("出庫請求---");           	                                    
            var lock=false;//默認未鎖定
            var myconfirm=layer.confirm('是否確認出庫?',{btn: ['確定','取消']},function(index){
                        console.log('success');
                        console.log(lock);
                         //
                         if(!lock){
                        	 lock=true;//鎖定
                             //發送
                           console.log("ajax---");
                             //發送ajax
                               $.ajax({
                                   url:  '/dubbo/../outBoundByTask.json',
                                   isAysn: false,
                                   type: 'get',
                                   contentType: 'application/json',
                                   data:params.join('&'),
                                   success: function (result) {
                                                          	
                                   	var res=$.parseJSON(result);
                                    var code=res.code;
                                    	
                                    	if(code==0){
                                    		layer.msg("操作成功!");
                                    		window.location.reload();
                                    	}else{
                                    		layer.msg(res.msg);
                                    	}
                                   	
                                       

                                   }
                               });
                         }
                         layer.close(myconfirm);
                        }
                        ,function(index){
                          console.log('fail');
                        });
                }
                  
                
發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章