nuxt.js axios 封裝

1,首先安裝axios

npm install axios

2,在專案檔案pluginsw資料夾裡（哪個資料夾自己隨便啊）建立axios.js，程式碼如下：

import axios from 'axios'
//定義fetch函式，config為配置
export function fetch(config){
//返回promise物件
return new Promise((resolve,reject) =>{
//建立axios例項，把基本的配置放進去
const instance = axios.create({
//定義請求檔案型別
headers:{
'Content-Type': 'application/json',
},
// 請求超時
timeout: 5000,
//定義請求根目錄
baseURL: 'http://ws.sandbox.mammasay.com/'
});
//請求成功後執行的函式
instance(config).then(res =>{
console.log(res);
resolve(res);
//失敗後執行的函式
}).catch(err => {
console.log(err);
reject(err);
})
});
}

// 封裝呼叫的介面 getData
export function getData(url,type,data) {
//如果type為空，預設為post方法，也可以自己改成get
if(type==='')
type = 'post';
return fetch({
//這裡的url為baseURL下介面地址，如baseURL為'www.baidu.com',介面地址為'www.baidu.com/api/getdata',那麼url裡就寫'api/getdata'
url: url,
method: type,
data: data,
})
}

3，在其他元件裡邊使用

首先引入axios.js

import { getData } from '~/plugins/axios.js'

然後使用：

getData('方法名','type',傳值).then( res => {
         console.log(res)
 }), err => {
         console.log(err)
 }