Axios 獲取上傳進度報錯問題

錯誤問題

l.upload.addEventListener is not a function
複製代碼

這個問題是因爲mockjs改動了axios裏面XMLHttpRequest對象致使的

根據axios源碼 l是一個XMLHttpRequest對象

mockJs把l變量從XMLHttpRequest對象改爲了MockXMLHttpRequest對象

因此l.upload是一個空對象 空對象沒有 addEventListener方法 因此報錯

解決

方法1

在工程node_modules/mockjs/dist/mock.js文件裏 在mockjs判斷的條件的地方 （搜尋）->/若是未找到匹配的數據模板，則採用原生 XHR 發送請求。/ 通常是8308行位置 添加代碼

MockXMLHttpRequest.prototype.upload = xhr.upload;
複製代碼

給MockXMLHttpRequest對象添加一個原生xhr.upload方法。

方法2

在工程node_modules/mockjs/src/xhr/xhr.js

通常是第216行添加代碼

MockXMLHttpRequest.prototype.upload = xhr.upload;
複製代碼

這個方法要從新編譯才能夠生效

總結

遇到問題不要慌，看看是那一行代碼報錯了，而後找到這一行代碼，再去作具體分析。

ps:第一次寫博客，記錄一下工做中的問題，也但願可以幫助到你們。