vue封装axios

http.js

import axios from 'axios'
axios.defaults.baseURL = 'http://127.0.0.1:2000'
axios.defaults.timeout = 5000
axios.defaults.headers['Content-Type'] = 'application/x-www-form-urlencoded; charset=UTF-8'

// 注意这里的content-type,可以跟axios.defaults.headers.post['Content-Type']对比一下，传递到后端的数据格式是不一样的，一种是json一种是form data

axios.defaults.headers["Accept"] = "*/*";
axios.interceptors.request.use(function (config) {
    //config.headers.token = '这里是配置token等header信息，要跟后端配合，后端允许才可以'
    return config;
  }, function (error) {
    return Promise.reject(error);
});

axios.interceptors.response.use(function (response) {
    return response;
  }, function (error) {
    return Promise.reject(error);
});

let get = function(url, params={}){    
    return new Promise((resolve, reject) =>{        
        axios.get(url, {            
            params: params        
        }).then(res => {
            resolve(res.data);
        }).catch(err =>{
            reject(err.data)
    })    
});}

let  post = function(url, params={}) {
    return new Promise((resolve, reject) => {
      axios.post(url, params)
         .then(res => {
             resolve(res.data);
         })
         .catch(err =>{
             reject(err.data)
         })
    });
}

export default {get,post}

main.js

import http from '@/utils/http'
Vue.prototype.$http = http

在总入口文件要引入之后，将它赋值给vue实例的原型，就可以全局使用了

使用

this.$http.get("/api/getusers", {
           username: this.username,
           password: this.password
        })
        .then(res => {
          console.log(res);
        });

如果控制台传的参数是{“username”:“name”,“psd”:“123”}:
那么将加上qs，axios.post(url, qs.stringify(params)),将传入的参数处理一下