使用Vue搭建電商後臺管理系統--有關axios的配置問題

關於每個元件都需要單獨引入 axios的問題

• 解決方法： 在main.js中匯入axios,將axios新增到Vue.prototype原型中

Vue.prototype.$http = axios
//Vue的例項物件可以使用原型物件中的$http物件，元件可以看成是Vue的例項，所以可以直接使用，把其他檔案中的axios替換成`this.$http`即可
複製程式碼

關於傳送請求，url都要拼上基準地址的情況

• 解決方法：在main.js中配置公共地址axios.defaults.baseUrl = 基準地址,在axios傳送的請求中只需要寫介面地址即可

關於每個介面都要設定headers的問題

• 解決方法：配置axios的請求攔截器，同一新增headers

axios.interceptors.request.use(function(config) {
    //請求攔截器：所有的請求之前都要執行的操作
    //所以只需要在攔截器中設定請求頭即可
    config.headers.Authorization = localStorage.getItem('token')
    return config
})
複製程式碼