vue中axios的封装和管理

新建一个http.js和一个api.js文件。http.js文件用来封装axios,api.js用来管理接口。

一、http.js文件

引入axios

import axios from ‘axios’

环境的切换
vue中axios的封装和管理
设置请求超时
vue中axios的封装和管理
请求拦截
vue中axios的封装和管理
响应拦截
vue中axios的封装和管理
注:请求拦截和响应拦截可按实际需求决定写或是不写
封装get、post或其他方法
vue中axios的封装和管理

二、api.js文件

api.js中引入http.js里面封装的get和post方法
vue中axios的封装和管理
例如一个get请求,可以:
vue中axios的封装和管理
getAppIndex是我们自己封装的方法名,然后调用了我们在http.js里面封装的get方法。
vue中axios的封装和管理
这是需要拼接id的情况可按实际情况决定

三、vue文件中

vue中axios的封装和管理