一、直接使用axios时

1、在main.js中：

 import axios from 'axios'
 Vue.prototype.$axios = axios; // 在模板中可直接使用this.$axios进行接口调用
 axios.defaults.baseURL = '/api' 

2、模板文件中的method中

methods: {
    //获取用户列表
    getUsers() {
            this.$axios.get("/user/listpage").then((res)=>{
            this.total = res.data.total;
            this.users = res.data.users;
     })
}

3、配置文件（config/index.js）

#dev中的proxyTable的值：
proxyTable: {
      '/api': {#匹配/api的path，因为main中baseUrl是/api
        target: 'http://127.0.0.1:5000/', # 服务端
        changeOrigin: true,//跨域配置
        pathRewrite: {
          '^/api': '' #前端发请求匹配到的api替换成空，如上例：前端将请求“http://127.0.0.1:5000/api/user/listpage”,但真实请求是“http://127.0.0.1:5000/user/listpage”
        }
      } 

二、封装axios时

1、api目录下封装axios到api.js

import axios from 'axios';
let base = '/api';
export const getUserListPage = params => { return axios.get(`${base}/user/listpage`, { params: params }); };
# 可以把所有服务端接口封装到该文件下，都是按照export的格式
# export const requestLogin = params => { return axios.post(`${base}/login`, params).then(res => res.data); };
# export const removeUser = params => { return axios.get(`${base}/user/remove`, { params: params }); };

2、export封装好的api，在api目录下的index.js文件

import * as api from './api'; # 上面封装的所有服务端接口的导入
export default api; # export让别人使用

3、模板中的method

import { getUserListPage } from '../../api/api'; # 引入封装好的api模块
methods: {
            //获取用户列表
            getUsers() {
                let para = { // 请求参数
                    page: this.page,
                    name: this.filters.name
                };
                this.listLoading = true;
                getUserListPage(para).then((res) => { #调用封装的该方法
                    this.total = res.data.total;
                    this.users = res.data.users;
                    this.listLoading = false;
                    //NProgress.done();
                });
}

4、跨域配置，依旧在config/index，同上