Vue使用axios调用请求

1.安装axios和qs依赖

npm install axios --save

npm install qs --save

2.在main.js引用

import qs from 'qs';
import axios from "axios";

//下面是将$axios和$qs挂在原型上，以便在实例中能用 this.$axios能够拿到
Vue.prototype.$axios = axios
Vue.prototype.$qs = qs

3.定义global.js，并在main.js引用并挂载

global.js的内容如下：

const host = '协议+域名地址+端口'
export default {
  host
}

在main.js加入

import Global from '../static/config/global'   //引用
Vue.prototype.GLOBAL = Global   //挂载原型，可以使用this.GLOBAL拿到global.js的内容

4.请求接口

不需要带参数的get请求：

this.$axios.get(this.GLOBAL.host+“后台接口地址”).then(res => {
　　//获取你需要用到的数据
})

需要带参数的get请求：

this.$axios.get(this.GLOBAL.host+“后台接口地址”,{
    params:{            
        phone:1234   //参数，键值对，key值：value值
        name:lyh
    }
}).then(res => {
    //获取你需要用到的数据
});

post请求（FormData）：

var data = {phone：1234，name：lyh}  //定义一个data储存需要带的参数
this.$axios.post(this.GLOBAL.host+“后台接口地址”，this.$qs.stringify(data)
).then(res =>{
    //获取你需要的数据
})

 post请求（Json）：

var data = {phone：1234，name：lyh}  //定义一个data储存需要带的参数
this.$axios.post(this.GLOBAL.host+“后台接口地址”，data).then(res =>{
    //获取你需要的数据
})