目录
一、axios三种基本写法
二、axios的二次封装
三、Api的解耦
一、axios三种基本写法
1）get方法（是最简单的）：
写法二：
2）post：
3）axios请求配置
默认是get请求，如果是默认就不需要写method:，如果是post请求就要method声明。
二、axios的二次封装
1）二次封装的意义：有很多，最主要的是为了方便管理。另一方面，有时候我们项目中涉及权限问题，我们登陆时需要判断用户是否是登录状态，这种判断如果在某个页面单独做会很麻烦冗余，就可以放在封装内。
情景假设：有三个页面，每个页面都需要发送5次请求，如果在每个页面中单独写，就需要写15次，这时当后面地址由开发环境158.12.4之类换做发布环境http://shouyeh.cn之类时，改动太麻烦。而封装后只需要修改一次即可。
baseURL：相当于一个变量，如下图所示。
2）具体步骤：
第一步：在src中新建一个目录utils，然后在utils内新建一个request.js文件。
第二步，在request.js内进行配置。引入axios；创建axios对象；添加请求拦截器；添加响应拦截器。
第三步，在app.vue中，引入request。
注意：
第二步中比较重要的是，根据需要可以在请求拦截器判断是否在登录状态。
在响应拦截器中，看到后端给前端的返回数据。
三、Api的解耦
1）api解耦的意义：一是为了同一个接口可能多次使用，封装起来后直接调用就可以。
在实际项目中，可能会面临同一个接口在多个地方调用的情况，比如头部导航栏和下面分区导航链接所指的是同一个内容。就像美团可以在首页推荐直接点外卖，也可以进入外卖导航栏内点食物链接一样。
二是为了方便api请求统一管理。
2）具体步骤：
第一步，先在src文件夹下新建api文件夹。然后在api文件夹下新建.js文件，这些.js文件可以进行分类，比如某一个页面的放在一起。
第二步，在.js文件中，先引入request。接着将接口定义为函数，这样在页面中使用时只要写函数就可以了，不用再写url。
需要数据时直接在函数里写请求参数就可以，参考步骤三的图二。
注意，查询课程这个接口函数（data），有个data参数，是因为这个接口后端规定他必须有请求参数，而图中我们使用了ES6语法糖，在return中data：data，和图一这样写是一样的。
第三步，在app.vue页面使用接口。首先引入接口函数，然后直接引用封装的函数就可以了。
