记axios有关

axios有关

介绍

1.axios具体官方介绍见添加链接描述 （axios中文网）
这里就跳过axios的特性和安装介绍了，直接贴最常用的代码和对应说明
2.
2.1 get请求

axios.get('/user?id=123').then(function(response){
    console.log(response);  //
})
.catch(function(error){
    console.log(error);
});

//等同于下面的
axios.get('/user',{
    params:{
        id:123
    }
}).then(function(response){
    console.log(response);
})
.catch(function(error){
    console.log(error);
})
在这里插入代码片

2.2 post请求

//post请求
axios.post('/user',{
    firstName:'Fred',
    last:'Ann'
})
.then(function(response){
    console.log(response);
})
.catch(function(error){
    console.log(error);
})

2.3 执行多个并发请求

function getUserAccont(){
    return axios.get('/user/123');
}
function getUserPermission(){
    return axios.get('/user/123/permission');
}
axios.all([getUserAccont(),getUserPermission()])
    .then(axios.spread(function(acct,perms){
        //2个请求现在都执行完成
    }))

3. 有关API
   3.1 axios(config); 有关参数配置的请求

//post
axios({
    method:'post',
    url:'/user/123',
    data:{
        fistName:'Fred',
        lastName:'Ann'
    }
})

3.2axios.create(); 创建一个axios实例

//自定义配置新建一个axios实例   axios.create([config])
var instance = axios.create({
    baseURL:'http://some/api',  //请求服务器的根路径，在每次请求的url之前加入的
    method:'get',  //默认是get
    timeout:1000, //指定请求超时的时间。超过该时间了，请求将被中断
    headers:{'Content-Type':'application/json'},  //即将被发送的自定义请求头
    transformResponse:[function(data){
        //允许对data进行转换处理
        return data;
    }],
    params:{
        id:123  //和请求一起发送的URL参数
    },
    responseType:'json',  //默认是，可以设置blob arrayBuffer  text等
})

3.2 默认值

//全局的axios默认值
axios.defaults.baseURL = 'http://api';
axios.defaults.headers.common['Authorization'] = AUTH_TOKEN;
axios.defaults.headers.post['Content-Type'] = 'application/x-www-form-urlencoded';

//在axios.create()创建了实例后可以修改默认值

3.3 拦截器
（没啥牛逼哄哄的，就是在发送请求之前要做的代码块或响应或修改接口返回数据）

//拦截器 ：  在请求或相应被then 或catch处理之前先拦截
//添加请求拦截器
axios.interceptors.request.use(function(config){
    //在发送请求之前要做的 ,配置token
    return config;
},function(error){
  //  console.log(error);
    return Promise.reject(error);
})

//添加响应拦截器
axios.interceptors.response.use(function(response){
   //对响应数据做的
    return response;
},function(error){
    //
    return Promise.reject(error);
})

总结：看下文档，了解个基本，实际运用中再加深理解。