vue封裝api介面

在沒有封裝api之前，我們是類似這樣使用 axios 的

this.$axios.post('blogarticle/frontlist',parms)

.then((resp) => )

userlist(parms).then(resp => )

我最開始就是有這樣的疑惑，所有我一直沒有使用api的封裝，因為我確實找不到使用它的理由。

那你是不是要改一百次？

改一百次還是時間問題，問題是你知道這一百個頁面都在那裡嘛？你根本找不到

為了解決上面的問題，和使得**更加的規範，我們可以把api進行封裝。

1.在專案src目錄下新建utils資料夾，然後在其中新建 request.js檔案，這個檔案是主要書寫axios的封裝過程。

//引入axios

import axios from 'axios'
import store from '../store'
//1. 建立新的axios例項，
const instance = axios.create()
// 請求***
instance.interceptors.request.use((config)=>` //請求頭加上token
}return config
})// 響應***
instance.interceptors.response.use((res)=>
return res
})// 將新建立的乙個axios匯出
export default instance

//在api資料夾裡引入剛才建立好的request檔案

import request from './request'
//在這裡統一管理請求方法 ， 
export function gets(url,data))
}export function posts(url,data)
export function getbanner()

import  from '../util/api';

let = await getbanner()
// console.log(res)

vue專案封裝api介面（詳解）

在前端vue的開發中，有一點是必須要做的，那就是將所有的api介面封裝起來，因為從開發到最終上線的過程中，api是需要經常更換的，所以需要將api封裝起來，便於修改和更換。在所有的api中，每乙個api都會分成兩個部分，比如 這是分成基本路徑和最後的方法兩部分的，一般情況下如果需要更換api的時候，...

封裝API介面

封裝api介面 目的 為了以後修改介面方便，如果專案很大，在每乙個頁面裡修改介面的話，很麻煩，所以封裝在乙個檔案裡，找起來也很方便 如何封裝 1.在src下建乙個restful資料夾，在此下面建乙個api.js檔案 2.因為上面的介面位址寫的是 api 所以要在config資料夾下的index.js...

api介面封裝

作用 為了以後修改介面方便，如果專案很大，在每乙個頁面裡修改介面的話，很麻煩，所以封裝在乙個檔案裡，找起來也很方便 http.js 中 import axios from axios 環境的切換 環境指的是就是開發環境 和 生產環境 npm run build之後 開發環境 development ...