小程序跳转快速点击，出现跳转两次问题。

小程序快速点击跳转问题

最新推荐文章于 2023-02-21 12:41:29 发布

原创最新推荐文章于 2023-02-21 12:41:29 发布 · 5.6k 阅读

2 ·

CC 4.0 BY-SA版权

javascript 同时被 3 个专栏收录

16 篇文章

订阅专栏

6 篇文章

订阅专栏

小程序

5 篇文章

订阅专栏

本文探讨了小程序中快速连续点击导致的重复跳转问题，分析了页面加载延迟与跳转函数延迟之间的关联，并提供了使用全局变量控制点击状态的解决方案。

小程序跳转快速点击，出现跳转两次问题。

经过测试发现，小程序点击跳转后，页面页面加载渲染需要时间，本身有延迟，所以我们快速点击会有多次跳转。而且跳转后的success也会有延迟。以下是测试代码：

 // app.js
    doubleClick:function(flag,targ){
      var that=this; 
      if (targ.errMsg.split(":")[1]=="ok"){
        that.globalData.doubleClick = flag;
        console.log("okokok");
      }else{
        that.globalData.doubleClick = !flag;
      }
    }

 // start.js
  start:function(res){  
    console.log("start");
    if(app.globalData.doubleClick){
      app.doubleClick(false, res);
      wx.navigateTo({
        url: '../select/select',
        success:function(e){ 
          console.log("success");
          app.doubleClick(false, e);
        },fail:function(e){
          console.log("fail");
          app.doubleClick(true, e);
        }
      }) 
    } 
  }

快速点击结果是什么呢？

所以只能用最基本的方法来处理。

onShow:function(){
    app.doubleClick(true);
  }, 
  start:function(res){   
    if(app.globalData.doubleClick){
      app.doubleClick(false);
      console.log("success");
      wx.navigateTo({
        url: '../select/select'  
      }) 
    } 
  }


    // app.js
    doubleClick:function(flag){
      var that=this;   
        that.globalData.doubleClick = flag; 
    }