微信小程序重复点击的解决方法

有时候会遇到这种情况,用户第一次点击跳转,由于终端性能的问题，页面未响应，出现卡顿现象,所以用户很着急，就一直点点点，过了一会，页面反应过来了，跳转了好几个页面。

这对用户体验肯定不好，解决方案如下

1.这是最普遍的解决方法,设置一个值，根据值来判断下面的代码执不执行。 不是很推荐

1. if (!this.data.isNext) return
2.     this.data.isNext = false
3.  
4. wx.navigateTo({
5.     url:'/pages/shop/goods/index',
6.     success: () => {
7.         this.data.isNext = true
8.     },
9.     fail: ()=>{
10.         this.data.isNext = true
11.     }
12. })

2.推荐这个,少了很多易打错的代码

1. wx.showLoading({
2.     title:"处理中",
3.     mask: true //是否显示透明蒙层，防止触摸穿透
4. })
5.  
6.  
7. wx.navigateTo({
8.     url:"/pages/shop/goods/index",
9.     complete: ()=>{
10.         wx.hideLoading()
11.     }
12.     //在这里写wx.hideLoading而不在底部写的原因是
13.  
14.     //大部分api都是异步的。这类 API 接口通常都接受一个 Object 类型的参数
15.     //1.success 成功回调
16.     //2.fail    失败回调
17.     //3.complete 完成回调 1跟2之后都会走这个
18.  
19. })