// 在http.js檔案中,處理axios
import axios from 'axios'
// 引入qs模組,用來序列化post型別的資料
;// 環境的切換
// 我們的專案環境可能有開發環境、測試環境和生產環境。我們通過node的環境變數來匹配我們的預設的介面url字首。axios.defaults.baseurl可以設定axios的預設請求位址就不多說了。
axios.defaults.baseurl =
'aaa/aaa/'
; // 通過axios.defaults.timeout設定預設的請求超時時間。例如超過了10s，就會告知使用者當前請求超時，請重新整理等。
axios.defaults.timeout = 10000
// axios.defaults.headers.post[
'content-type']=
; withcredentials:true
// 請求***
axios.interceptors.request.use(
config =
>
// debugger
const token =
'abcdefg'
; token &&
(config.headers.authorization = token)
;return config;
}, error =
>
, // 響應***
response =
>
else
}, // 伺服器狀態碼不是2開頭的的情況
// 這裡可以跟你們的後台開發人員協商好統一的錯誤狀態碼
// 然後根據返回的狀態碼進行一些操作，例如登入過期提示，錯誤提示等等
// 下面列舉幾個常見的操作，其他需求可自行擴充套件
error =
>})
;break
; // 403 token過期
// 登入過期對使用者進行提示
// 清除本地token和清空vuex中token物件
// 跳轉登入頁面
case 403:
toast();
// 清除token
localstorage.removeitem(
'token');
store.commit(
'loginsuccess', null)
; // 跳轉登入頁面，並將要瀏覽的頁面fullpath傳過去，登入成功後跳轉需要訪問的頁面
settimeout(()=
>})
;}, 1000)
;break
; // 404請求不存在
case 404:
toast();
break
; // 其他錯誤，直接丟擲錯誤提示
default:
toast();
}return promise.reject(error.response);}
})export
function get(url, params)
).then(res =
> ).catch(err =
> )
});}
export function post(url, params)
) .catch(err =
>)}
);}
// api.js
// 用於統一管理我們的介面
Vue中模組化管理
vue對比我之前使用的angular，最大的改變是將乙個元件組合成乙個.vue檔案，讓目錄結構簡單了不少。下面我將.vue檔案稱為元件，js檔案稱為模組，記錄一下模組化管理的一些小細節 模組化管理就像自定義函式一樣，把一些東西單獨拎出來，讓根模組 入口檔案main.js 簡介一些 下面用三個例子說明...
ES6模組化管理
require module.exports common.js規範 amd cmd es6模組 模組 export import export 用於該模組向其他模組匯出的介面 import 用於接收其他模組匯入的值 模組指定預設輸出 export default export var a 100 ...
什麼是模組化？模組化的好處
1.高內聚低耦合，有利於團隊作戰，當專案很複雜的時候，將專案劃分為子模組分給不同的人開發，最後再組合在一起，這樣可以降低模組與模組之間的依賴關係體現低耦合，模組又有特定功能體現高內聚。2.可重用，方便維護，模組的特點就是有特定功能，當兩個專案都需要某種功能的時候，我們定義乙個特定的模組來實現該功能，...