解決vue 使用axios.all()方法發(fā)起多個(gè)請(qǐng)求控制臺(tái)報(bào)錯(cuò)的問(wèn)題
今天在項(xiàng)目中使用axios時(shí)發(fā)現(xiàn)axios.all() 方法可以執(zhí)行但是控制臺(tái)報(bào)錯(cuò),后來(lái)在論壇中看到是由于axios.all() 方法并沒(méi)有掛載到 axios對(duì)象上,需要我們手動(dòng)去添加
== 只需要在你封裝的axios文件里加入 ==
instance.all = axios.all
就完美解決了!
補(bǔ)充知識(shí):vue項(xiàng)目中使用axios.all處理并發(fā)請(qǐng)求報(bào)_util2.default.axios.all is not a function異常
報(bào)錯(cuò):
_util2.default.axios.all is not a function
代碼:
init () { util.axios.all([this.getCourseInit(), this.getConfirmInit()]).then(util.axios.spread((indexRes, confirmRes) => { // 兩個(gè)請(qǐng)求現(xiàn)在都執(zhí)行完成 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’); },
原因:
axios實(shí)例沒(méi)有all這個(gè)方法,all是axios的靜態(tài)方法
解決辦法:
以下方法不是最好的,還沒(méi)找到更好的解決辦法,目前先這樣解決。
// 引入axios import axios from ’axios’; init () { axios.all([this.getCourseInit(), this.getConfirmInit()]).then(axios.spread((indexRes, confirmRes) => { // 兩個(gè)請(qǐng)求現(xiàn)在都執(zhí)行完成 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’); },
以上這篇解決vue 使用axios.all()方法發(fā)起多個(gè)請(qǐng)求控制臺(tái)報(bào)錯(cuò)的問(wèn)題就是小編分享給大家的全部?jī)?nèi)容了,希望能給大家一個(gè)參考,也希望大家多多支持好吧啦網(wǎng)。
相關(guān)文章:
1. IDEA EasyCode 一鍵幫你生成所需代碼2. IntelliJ IDEA設(shè)置條件斷點(diǎn)的方法步驟3. Java構(gòu)建JDBC應(yīng)用程序的實(shí)例操作4. Spring應(yīng)用拋出NoUniqueBeanDefinitionException異常的解決方案5. ThinkPHP5 通過(guò)ajax插入圖片并實(shí)時(shí)顯示(完整代碼)6. javascript設(shè)計(jì)模式 ? 建造者模式原理與應(yīng)用實(shí)例分析7. 一篇文章帶你了解JavaScript-對(duì)象8. Python使用oslo.vmware管理ESXI虛擬機(jī)的示例參考9. Express 框架中使用 EJS 模板引擎并結(jié)合 silly-datetime 庫(kù)進(jìn)行日期格式化的實(shí)現(xiàn)方法10. 使用AJAX(包含正則表達(dá)式)驗(yàn)證用戶登錄的步驟
