1、简介
系统中关于请求使用axios实现，axios是一个基于 promise 的 HTTP 库，类似ajax，进行前后端对接的时候，使用这个工具可以提高我们的开发效率
官网：
2、安装
cnpm install axios --save
3、封装request工具
为了方便使用 我们可以基于axios封装请求模块request.js，这样方便使用
import axios from 'axios'
/**
* 创建一个axios实列，这个实列和axios本身功能一摸一样
* 相应的配置给这个实列,这个实例，可以多个 每个实例单独使用，比如设置不同的baseUr,
* 而不建议在main.js中直接axios.defaults.baseURL = "xxx"
*/
const requst = axios.create({
timeout:5000,
baseURL:'http://xxxx'
})
/**
* 请求拦截
* config是请求相关配置 任何请求都经过这里，这里处理统一业务 比如设置token
*/
requst.interceptors.request.use(config=>{
const token = window.localStorage.getItem("token");
if (token) {
config.headers.token = token
}
return config
})
/**
* 响应拦截
* response响应成功 正常处理
* error响应失败
*/
requst.interceptors.response.use(response => {
let res = response.data
if (res.code === 200) {
return response
} else if (res.code === 201) {
Element.Message.error('请登录')
router.push("/login")
return Promise.reject(response.data.msg)
} else {
Element.Message.error(!res.msg ? '系统异常' : res.msg)
return Promise.reject(response.data.msg)
}
}, error => {
Element.Message.error('系统异常')
return Promise.reject(error)
/**
* 导出
*/
export default requst
4、请求api
get请求方式
/**get请求的几种方式，不用考虑content-type，服务端注意接受的时候不要用@RequestBody，
直接实体或者参数列表接受即可/
无参
axios.get('/url')
axios({ methods: 'get', url: '/ulr' })
有参数
axios.get('/url?id='+id)
axios.get('/url/123')
axios.get('/url', {params: {id: 12}})//请求的地址实际为 localhost:8080/url?id=12
axios({
methods: 'get',
url: 'url',
params: {
id:12
}
})
post请求方式
参考文章
谈谈axios配置请求头content-type - pubdreamcc - 博客园
1、post以json格式提交数据（默认就是json格式提交数据）
let data = {}
let config = {}
方式一: axios.post('/url',data,config)
方式二: axios({
methods: 'post',
url: '/url',
data: data,
config: config
})
2、post以form表单方式提交内容
request.post('/login',qs.stringify(params) )
