问题描述

promise.all(promises);promises是一个请求数组，希望请求完后可以resolve数据，但是并没有成功。

问题出现的环境背景

首页有5个get请求，axios超时拦截显示一个div，点击重新发起请求，但是前台页面接收到只有最后一个请求的response,所以我把请求放在一个数组里了，用promise.all发起，但是无法resolve数据

相关代码

// 请把代码文本粘贴到下方（请勿用图片代替代码）

import Axios from 'axios'
import Qs from 'qs'
import Vue from 'vue'
Axios.defaults.timeout = 500
var configArr=[]
const request = (options) => new Promise((resolve, reject) => {
    const page404 = (config) => {
        var Arr = [config];
        if(configArr.length>0){
            if(Arr.indexOf(configArr)<0){
                configArr.push(config);
            }
        }else{
            configArr.push(config);
        }
        var configarr=[];
        for(var i=0;i<configArr.length;i++){
            if(configarr.indexOf(configArr[i])<0){
                configarr.push(configArr[i]);
            }
        }
        document.getElementById('loadAgain').style.display='block';
        let c = Vue.extend({
        template:'<div id="loadAgain" @click="loadAgain"><div class="loadBox"><img src="static/img/woply_404@2x.png"/></div><p class="load-p">网络不给力</p><p class="load-p">点击屏幕，重新加载</p></div>',
             methods: {
                loadAgain() {
                    configArr=[];
                        let promises=[];
                        let result=[];
                        for(let i=0;i<configarr.length;i++){
                            promises.push(new Promise((resolve1, reject1) =>{
                                return request(configarr[i]).then((res) => {
                                  if (typeof res == 'string') {
                                    res = JSON.parse(res)
                                  }
                                  result.push(res);
                                  resolve1(res);
                                })
                                .catch((err) => {
                                })
                                resolve1(result)
                            }))
                        }
                        Promise.all(promises).then(resultArray => {
                            console.log(result);
                            console.log(resultArray);
                            resolve(resultArray)
                        })
                        result=[];
                        configarr=[]
                    document.getElementById('loadAgain').style.display='none';

                }
            }
        })
         new c().$mount('#loadAgain');
     }
 
     Axios.interceptors.response.use((response) => {
        //卸载404组件
        document.getElementById('loadAgain').style.display='none';
        return response;
     }, (error) => {
        let config=error.config;
        if(error.code=='ECONNABORTED'&& error.message.indexOf('timeout')!=-1){
            //超时处理
            document.getElementById('loadAgain').style.display='block';
            page404(config);
        }
        if(error.message.indexOf('Network')!=-1){
             //网络异常
             setTimeout(function(){
                page404(config);
             },5000)
        }
        return Promise.reject(error);
     });

    Axios.request(options)
    .then((res) => {
      if (typeof res == 'string') {
        res = JSON.parse(res)
      }
      resolve(res)
    })
    .catch((err) => {
    })
})

export default {
    get: (URL,options) => new Promise((resolve, reject) => {
        return request(Object.assign({}, options, { method: "get" ,url:URL})).then(res => {resolve(res)})
    }),
    post: (URL,params,options) => new Promise((resolve, reject) => {
        return request(Object.assign({}, options, { 
          method: "post",
          url:URL,
          headers: {
            'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
          },
          data:params,
          paramsSerializer: function(params) {
            return Qs.stringify(params, {arrayFormat: 'brackets'})
          },
        })).then(res => {resolve(res)})
    })
}

你期待的结果是什么？实际看到的错误信息又是什么？

resolve后首页的请求可以拿到response，但是并没有到那里