vue 2 0中使用axios遇到問題的解決方法

2021-10-10 21:15:27 字數 1466 閱讀 7467

在vue1.0的時候有乙個官方推薦的 ajax 外掛程式 vue-resource,但是自從 vue 更新到 2.0 之後,官方就不再更新 vue-resource。

目前主流的 vue 專案,都選擇 axios 來完成 ajax 請求,下面簡單介紹一下axios的使用,具體用法可參考npm鏈結

npm install axios -s

//使用**源

cnpm install axios -s

//使用bower

bower install axios -s

//或者使用cdn:

安裝其他外掛程式的時候,可以直接在 main.js 中引入並使用 vue.use()來註冊,但是 axios並不是vue外掛程式,所以不能 使用vue.use(),所以只能在每個需要傳送請求的元件中即時引入。

為了解決這個問題,我們在引入 axios 之後,通過修改原型鏈,來更方便的使用。

在 main.js 中新增了這兩行**之後,就能直接在元件的 methods 中使用 $http命令

methods: })}

在專案開發中,後台介面已經開發好了(對接ios、安卓),h5開發用了vue+axios,可是用post提交結果報錯,如下圖:

1,簡單直接有效(直接將資料拼接成字串)

"username=15989346035&pwd=***xx&skey=skey&type=1")

.then(function(res))

.catch(function(err))

2,也可以實現

var params = new urlsearchparams();

"username=15989346035&pwd=e10adc3949ba59abbe5")

.then(function(res))

.catch(function(err))

3,網上搜尋出來比較多人使用的(不知道什麼原因,我試驗沒有成功,大家可以嘗試說不定用)

axios(,

transformrequest: [function (data)

return ret

}],headers:

})

axios傳送請求:

axios中post提交表單資料:

vue2 0 中引入和使用 axios

axios 是乙個基於 promise 的 http 庫,可以用在瀏覽器和 node.js 中。features 從瀏覽器中建立 xmlhttprequests 從 node.js 建立 http 請求 支援 promise api 攔截請求和響應 轉換請求資料和響應資料 取消請求 自動轉換 jso...

vue2 0中的外掛程式axios互動

使用 npm npm install axios使用 bower bower install axios使用 cdn src script 執行get請求 為給定 id 的 user 建立請求 axios.get user?id 12345 then function response catch ...

vue2 0封裝axios請求

vue封裝網路模組 第一步 在scr裡面建立乙個network資料夾,在network資料夾裡面建立三個檔案 第二步 第乙個資料夾 config.js,在裡面寫入以下 定義請求方式 export const method export const path 第二個資料夾 core.js 在裡面寫入以...