-
axios并行请求,然后统一处理。
axios.spread() 的参数个数等于axios的请求数。
axios.all([ axios.get('/data.json'), axiso.get('/city.json') ]).then( axios.spread((dataRes, cityRes) => { console.table(dataRes, cityRes) } )
查看全部 -
get请求 Query String
post请求
查看全部 -
let formData = new FormData();
for(let key in data){
formData.append(key,value);
}
//表单提交
axios.post("/post",formData).then(res=>{
console.log(res);
})
查看全部 -
axios.post() 三个参数,分别是,url路径,请求的数据data,config
data有两种:
form-data 表单提交(图片、文件上传)
application/json
查看全部 -
注意真实项目中router.js里面路由的写法:
{
path: '/',
name: 'HelloWorld',
component: HelloWorld//第一种方式
},
{
path: '/axios',
name: 'axios',
// component: Axios
component:()=>import('../components/Axios')//第二种方式,按需引入真实项目使用
}
查看全部 -
axios.all([]).then(axios.spread(datdres,citydres)=>{})查看全部
-
axios配置参数
baseURL:'http://localhost:8080',//请求的域名,基本地址 timeout:1000,//请求的超时时长,单位毫秒1000=1s url:'json/shouji.json'//请求的路径 method:'get,put',//get,put,post,patch,delete请求方法 headers:{ token:'' },//设置请求头 params:{},//请求参数拼接在URL上 data:{},//请求参数放在请求体
可以设置参数的地方:
1.axios全局配置
axios.defaults.timeout=1000
2.axios实例配置
let instance=axios.create()//不设置.默认使用全局配置.
instance.defaults.timeout=3000//可以在修改
3.axios请求配置
instance.get('/data.json',{timeout:5000})
查看全部 -
axios实例
类似数组创建方式两种:
let instance = this.$http.create({
baseURL:'http://localhost:8080',
timeout:1000
})
为什么要创建axios实例:后端接口地址有多个,并且超时时长不一样
查看全部 -
并发请求:同时进行多个请求,并统一处理返回值
axios.all()
axios.spread()
查看全部 -
axios请求方法:get,post,put,patch,delete
get:获取数据
post:提交数据 (表单提交+文件上传)
put:更新数据(所有数据推送到服务端(后端))
patch:更新数据(只将修改的数据推送到后端)
delete:删除数据
查看全部 -
axios的特性:
1.支持Promise API
2.拦截请求和响应
3.转换请求数据和响应数据
4.取消请求 5.自动转换json数据 6.客户端支持防御XSRF攻击
查看全部 -
取消正在进行的http请求
查看全部 -
实际开发中一般添加同意的错误处理
查看全部 -
let instance = axios.create({
baseURL:"http:localhost:8080",
tieout:3000
});
instance.get('/data.json')
超时报错401
查看全部 -
后端接口地址有多个,并且超时时间不一样
查看全部
举报