axios请求方法:
get 获取数据
// 写法一 localhost:8080/data.json?id=12
axios.get('/data.json',{
params:{
id:12
}
}).then(res=>{
console.log(res)
})
// 写法二,别名写法
axios({
method:'get',
url:'/data.json',
params:{
id:12
}
}).then(res=>{
console.log(res)
})
post 提交数据(表单提交+文件上传)
// post application/json请求
let data = {id:12}
axios({
method:'post',
url:'/post',
data: data
}).then(res=>{
console.log(res)
})
// post form-data表单提交(图片、文件上传) 请求
let formData = new FormData()
// 手动创建一个formData格式的数据
for(let key in data){
formData.append(key,data[key])
}
axios.post('/post',formData).then(
res=>{
console.log(res)
}
)
put 更新数据(所有数据推送到后端)
patch 更新数据(只将修改的数据推送到后端)
delete 删除数据
并发请求(当一个页面需要请求多个接口,并同时处理返回值时)
axiso.all([
axios.get('/data.json'),
axios.get('/city.json')
]).then(
axios.spead(
(dataRes,cityRes)=>{
console.log(dataRes,cityRes)
}
)
)
拦截器:在请求或者响应被处理前拦截它们
http request 请求拦截器
axios.interceptors.request.use(
config => {
// 在发送请求前做些什么,比如加时间戳,加token
config.headers.token = ' '
return config;
},
error => {
// 对请求错误时做些什么
//常见的http错误状态码401超时,404找不到
return Promise.reject(error);
}
);
http response 响应拦截器
axios.interceptors.response.use(
res => {
// 请求成功后对响应数据做点什么
return res.data; //此处的res.data会到axios.get().then(res=>{})这里的res
},
error => {
// 对响应错误做点什么
//一般http状态码500系统错误,502系统重启
return Promise.reject(error)
}
)