栏目分类:
子分类:
返回
名师互学网用户登录
快速导航关闭
当前搜索
当前分类
子分类
实用工具
热门搜索
名师互学网 > IT > 软件开发 > Web开发 > JavaScript

解决vue 使用axios.all()方法发起多个请求控制台报错的问题

JavaScript 更新时间: 发布时间: IT归档 最新发布 模块sitemap 名妆网 法律咨询 聚返吧 英语巴士网 伯小乐 网商动力

解决vue 使用axios.all()方法发起多个请求控制台报错的问题

今天在项目中使用axios时发现axios.all() 方法可以执行但是控制台报错,后来在论坛中看到是由于axios.all() 方法并没有挂载到 axios对象上,需要我们手动去添加

== 只需要在你封装的axios文件里加入 ==

instance.all = axios.all

就完美解决了!

补充知识:vue项目中使用axios.all处理并发请求报_util2.default.axios.all is not a function异常

报错:

_util2.default.axios.all is not a function

代码:

init () {
      util.axios.all([this.getCourseInit(), this.getConfirmInit()])
 .then(util.axios.spread((indexRes, /confirm/iRes) => {
   // 两个请求现在都执行完成
   this.classData = indexRes.data.today_course.map(item => {
     item.time = timeUtil.formatDate2Str(item.start_time, 'HH:mm') + '~' + timeUtil.formatDate2Str(item.end_time, 'HH:mm');
     return item;
   });
   this.count.count_course_today = indexRes.data.count.count_course_today;
   this.count.count_student_not = indexRes.data.count.count_student_not;
   this.count.count_student_all = indexRes.data.count.count_student_all;
   this.count.count_teacher_all = indexRes.data.count.count_teacher_all;
 
   this.isLoading = false;
 }));
    },
    getCourseInit () {
      return util.axios.get('/index');
    },
    getConfirmInit () {
      return util.axios.get('/course-/confirm/i');
    },

原因:

axios实例没有all这个方法,all是axios的静态方法

解决办法:

以下方法不是最好的,还没找到更好的解决办法,目前先这样解决。

// 引入axios 
import axios from 'axios';
 
init () {
      axios.all([this.getCourseInit(), this.getConfirmInit()])
 .then(axios.spread((indexRes, /confirm/iRes) => {
   // 两个请求现在都执行完成
   this.classData = indexRes.data.today_course.map(item => {
     item.time = timeUtil.formatDate2Str(item.start_time, 'HH:mm') + '~' + timeUtil.formatDate2Str(item.end_time, 'HH:mm');
     return item;
   });
   this.count.count_course_today = indexRes.data.count.count_course_today;
   this.count.count_student_not = indexRes.data.count.count_student_not;
   this.count.count_student_all = indexRes.data.count.count_student_all;
   this.count.count_teacher_all = indexRes.data.count.count_teacher_all;
 
   this.isLoading = false;
 }));
    },
    getCourseInit () {
      return util.axios.get('/index');
    },
    getConfirmInit () {
      return util.axios.get('/course-/confirm/i');
    },

以上这篇解决vue 使用axios.all()方法发起多个请求控制台报错的问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持考高分网。

转载请注明:文章转载自 www.mshxw.com
本文地址:https://www.mshxw.com/it/67857.html
我们一直用心在做
关于我们 文章归档 网站地图 联系我们

版权所有 (c)2021-2022 MSHXW.COM

ICP备案号:晋ICP备2021003244-6号