微信小程序设置请求超时wx.request等，简单易懂！

微信小程序设置请求超时wx.request等

一、用到的方法：

个人理解，比较粗糙 看不懂可以百度一下具体用法
new Promise：new了一个函数或者方法，可以被Promise.race等方法调用
resolve：返回本方法成功要返回的数据 相当于success return
reject：返回本方法失败要返回的数据 相当于fail return 具体用法下面有
Promise.race：Promise.race([a,b]); race是Promise的一个方法可以调用 意为竞速，a和b是两个new的Promise方法，这个数组中可以存多个Promise方法，执行之后a和b会同时执行 哪个先执行完就运行哪个 另一个就停止运行
以上都为Promise相关
setTimeout：设置超时 如果设置5秒 执行开始 等待(延迟)5秒后再执行其中的方法
就相当于a封装了一个request请求，b为5秒超时时间，如果a在5秒内未完成b就会执行 同时a会停止

二、具体实现

先来两个简单的 先试试 可以执行 看不懂可以看下面有具体解释过的

 stop:function(){
     let a = new Promise((resolve,reject) => {
       if (true == false) {
         setTimeout(resolve,3000,'成功')
       }else{
         setTimeout(resolve,1000,'失败')
       }
     });
     let b = new Promise((resolve,reject)=>{
       setTimeout(reject,2000,'页面丢失了，请重新进入')
     })
     Promise.race([a,b]).then(
       success=>{
         console.log(success);//返回第二个resolve '失败'
       },
       err=>{
         console.log(err);
       }
     )
   }

let p1 = new Promise((resolve, reject) => {
  setTimeout(resolve, 1000, 'one');
});
let p2 = new Promise((resolve, reject) => {
  setTimeout(resolve, 2000, 'two');
});
Promise.race([p1, p2]).then((value) => {
  console.log(value);//这里p1延时1s 所以肯定是one
});

具体的 顺便加了个wx.request 很多行有解释

stop:function(){
	//从这里开始 是new了一个a方法
    let a = new Promise((resolve,reject) => {
      console.log("进方法了...... 从这里开始就是要正常执行的代码 直接放进去就行")
      console.log("第一个方法，下面示例wx.request")
      	wx.request({
		     url: url,
		     method: method,
		     data: data,
		     header: {...省略},
		     dataType: 'json',
		     success: function (res) {
		     //这里就相当于return了 因为Promise是new的一个方法 需要返回
		     //具体用resolve还是reject 其实都一样的 自己能判断出来执行开始之后要怎么写就可以了
		      resolve("操作成功");
		     },
		     fail: function (err) {
		      resolve("操作失败");
		     }
	    })
    });
    //a方法结束
    
    
    //b方法很简单 设置一个setTimeOut 
    let b = new Promise((resolve,reject)=>{
      //reject:返回失败 5000:延迟5秒执行 '页面丢失了，请重新进入':返回的数据
      setTimeout(reject,5000,'页面丢失了，请重新进入')
    })
    //b方法结束
	
	
	//这里调用a,b俩方法 上面的new a和b只是创建了 此处和上面并没有执行 
	//这里可以简写  a,b也可以有c（多个函数同时运行Promise.race([a,b,c])，不管有几个，只执行最快的一个）
    let aa = Promise.race([a,b]);

	//这里开始执行 .then就是开始执行aa aa为Promise.race([a,b]) 把a和b放一起运行了
    aa.then(
      //这里返回resolve就进入success 可以根据返回值判断执行完正常的代码如何继续下一步
      success=>{
      	//这里可以加一个判断
      	//if(success == '操作成功'){...}else if(success == '操作失败'){...}
        console.log(success);
      },
      //这里返回reject就进入err 可以根据返回值判断执行完正常的代码如何继续下一步
      err=>{
        console.log(err);
        //一个普通的wx.showModal 微信api有
        wx.showModal({
          title: '报错了',
          //这个err就是上面返回的字符串 '页面丢失了，请重新进入'
          content: err,
          showCancel: false,
          confirmText: '确定',
          //这个是wx.showModal弹框 点了确定之后执行的操作 示例跳别的页面
          success:(res) => {
          	//一个普通的跳转页面操作
            wx.reLaunch({
              url: '/pages/aaa/aaa',
            })
          }
        })
      }
    )
  },

原创作者：h仔
参考：https://developer.mozilla.org/zh-CN/docs/Web/JavaScript/Reference/Global_Objects/Promise/race