在前端vue的開發中,有一點是必須要做的,那就是將所有的api介面封裝起來,因為從開發到最終上線的過程中,api是需要經常更換的,所以需要將api封裝起來,便於修改和更換。
在所有的api中,每乙個api都會分成兩個部分,比如:這是分成基本路徑和最後的方法兩部分的,一般情況下如果需要更換api的時候,只是更換前半部分,最後的方法是不會改變的。
1.在src目錄下新建乙個api.js檔案,然後在檔案中寫入:
import
from
'element-ui'
//按需引入
// vue.use
//例子(原api介面):
const url =
''//api介面
const api =
//msdid是狀態碼、time時間
const
errormeaage
=function
(msgid,time)
else
if(msgid==
'429'
)else}}
export
default
2.這就封裝完了乙個 api 配置檔案了,然後在呼叫的時候,直接引入即可:
import axios from
"axios"
;import api from
"@/api.js"
;import qs from
"qs"
;//請求方法
getprovincialenterprise()
);//請求引數
var data =
; axios
.post
(api.api.getenterpriseinfo, qs.
stringify
(data)).
then
(function
(response)
else
if(data.code ==
204)})
.catch
(function
(error));
},
vue封裝api介面
在沒有封裝api之前,我們是類似這樣使用 axios 的 this.axios.post blogarticle frontlist parms then resp 封裝之後這樣呼叫 userlist parms then resp 我們先不看具體是怎麼封裝的,但看使用,發現好像寫的 一樣多呢。等你...
vue入門 對vue專案中api介面的封裝管理
很多朋友在開發過程中,習慣性直接將api的呼叫寫在單個元件之中,就直接呼叫請求。例如 在前端專案開發中,從整體架構出發,我們可以將專案中所有api進行封裝,從而便於我們進行統一管理。在src目錄下,新建api資料夾,在api資料夾下建立index.js和api.js。1 api.js。主要用來統一管...
vue專案api介面管理
預設vue專案中已經使用vue cli生成,安裝axios,基於element ui開發,axiosconfig目錄和api目錄是同級,主要記錄配置的相關。import vue from vue import axios from axios import qs from qs import fro...