1.新增axios.js文件安吁，內(nèi)容如下（二次封裝axios,方便我們后續(xù)項(xiàng)目的使用）

參數(shù)的數(shù)據(jù)格式分兩種
1.json對(duì)象類型  {name:1,password:1356565}
2.字符串類型    name:1,password:1356598   (需要下載qs插件進(jìn)行轉(zhuǎn)換)

import axios from 'axios'
import Qs from 'qs'（如果只是get請(qǐng)求就不需要引qs）
import { Message } from 'element-ui'  //引入element中的彈窗滴须，這個(gè)不是必須的可根據(jù)項(xiàng)目來
 
axios.defaults.withCredentials = false;  //false  不跨域  true 跨域
axios.defaults.headers.common['token'] = localstorage.getItem('token'); //設(shè)置請(qǐng)求頭公浪，這個(gè)是不是必須的

export  default function(path, params, method = "GET", headerType = "json")=>{
   let baseURL = "", data = {}
    baseURL = process.env.BASE_URL //這里是在config里面配置了請(qǐng)求路徑

      //設(shè)置請(qǐng)求頭
    if (method === 'post') {   //post請(qǐng)求
        if (headerType === "json") {
            axios.defaults.headers["Content-Type"] = 'application/json;charset=UTF-8'
            data = params
        } else {
            axios.defaults.headers["Content-Type"] = 'application/x-www-form-urlencoded;charset=UTF-8'
            data = Qs.stringify(params);
        }
    }

    //get請(qǐng)求
    if (method === 'get') {
        if (headerType == !'json') {
            axios.defaults.headers["Content-Type"] = 'application/x-www-form-urlencoded;charset=UTF-8'
        }
        data = Qs.stringify(params);
        path = path + '?' + data
        data = {};
    }
     // 請(qǐng)求攔截
    axios.interceptors.request.use(function (config) {
        let token = storage.getStorage("token")
        if (token) {
            config.headers['token'] = token;
        }
        return config;
       }, function (error) {
        return Promise.reject(error);
       });

      //響應(yīng)攔截
      axios.interceptors.response.use(response=>{
          if (response.headers.token) {
            storage.setStorage('token', response.headers.token)
          }
          if (response.data.statusCode == 20009) {  //這里的狀態(tài)碼是根據(jù)后臺(tái)設(shè)置的來
               Message.error({ message: '登錄過期收壕，請(qǐng)重新登錄' })
           }
           return response;
           },error=>{
              return Promise.resolve(error.response)
        })

       //發(fā)送請(qǐng)求
      return new Promise(()=>{
         axios({
            baseURL
            method
            url: path,
            headers歼捐，
            data:params,
            timeout:6000,
            }).then(result=>{
                resolve(result.data)
            }).catch(err=>{
                reject(err)
            })
         })
}

2.新增api.js文件氓拼，內(nèi)容如下（項(xiàng)目中所有的請(qǐng)求地址以及方式等都放在這個(gè)文件中你画，并導(dǎo)出）

import http from '@/utils/axios'  //引入我們二次封裝的axios.js文件


a. post請(qǐng)求，參數(shù)是json類型
          export const passwordUpdate = function (params) { 
                const url= '/account/accountUpdate';  //請(qǐng)求的地址
                return https(PASSWORDUPDARE, params, "post");  
          };

b.post請(qǐng)求桃漾，參數(shù)是字符串類型
           export const passwordUpdate = function (params) {
               const url= "/account/accountUpdate";  //請(qǐng)求的地址
                return https(PASSWORDUPDARE , params, "post", "from");
            };

c.get請(qǐng)求
           export const passwordUpdate = function (params) {
                const url= "/account/accountUpdate";  //請(qǐng)求的地址
                return https(PASSWORDUPDARE , params);
            };

3.頁面中使用我們封裝好的請(qǐng)求

1.先引入：import { requestLogin } from '@/api/api'  //需要調(diào)用哪個(gè)接口坏匪，就引入哪個(gè)，按需引入
2.使用
let params = {
  name:'zhangsan',
  password:'123456'
}
requestLogin(params ).then(res=>{   //我們只需要傳遞一個(gè)參數(shù)撬统，其他的都已經(jīng)在api.js中寫好了
    //獲取到后臺(tái)響應(yīng)的參數(shù)res适滓，并進(jìn)行操作
})