vue-axios并发请求

首先说同时发送请求,但是依然是有先后顺序的
其中有两个方法
axios.all() 它的参数是一个数组,数组里面包含了ajax请求
axios.spread() // 返回的数据进行分割

第一种写法
    axios.all([
      axios.get('/data.json', {  // 替换接口 这是模拟的假数据
        params: {
          id: 12
        }
      }),
      axios.get('/city.json') // 替换接口
    ]).then(axios.spread((resdata, rescity) => {
      // 上面两个请求都完成后,才执行这个回调方法
      console.log('resdata', resdata)
      console.log('rescity', rescity)
    }))
参数与接口
返回的结果
第二种写法

把请求都写在methods 然后在mounted()执行

  methods: {
    getAllTask() {
      return axios.get('/data.json', {
        params: {
          id: 10
        }
      })
    },
    getAllCity() {
      return axios.get('/city.json', {
        params: {
          id: 11
        }
      })
    }
  },
  mounted() {
    axios.all([this.getAllTask(), this.getAllCity()])
      .then(axios.spread(function(allTask, allCity) {
        console.log('请求1结果', allTask)
        console.log('请求2结果', allCity)
      }))
  },
参数与接口
返回的结果

你可能感兴趣的:(vue-axios并发请求)