axios的使用

Axios 是一个javascript基于 promise 的 HTTP 库。

什么是Promise，可以参考：https://wangdoc.com/es6/promise.html

//引用线上地址

<script src="https://unpkg.com/axios/dist/axios.min.js"></script>

一、创建实例

//常用配置
let cfg={
    url:"", //必填 如果指定了baseURL且url不是全路径，那么url=baseURL url
    method:"", //get or post,默认get
    baseURL:"http://192.168.0.85:8074/api/ProjectDZJG/", //`baseURL` 将自动加在 `url` 前面，除非 `url` 是一个绝对 URL
    transformResponse: [function (res) { //在传递给 then/catch 前，允许修改响应数据
        // 对 data 进行任意转换处理
        let resJson=JSON.parse(res); //对data进行任意转换处理,默认是字符串，需要用JSON.parse(res)进行转换        
        resJson.month.forEach((item,index,arr) => {
            arr[index]="2022年" item;
            //console.log(arr[index]);
        });

        return resJson;
    }],
    params: { //get参数
        //ID: 12345
    },
    data: { //post参数
        //firstName: 'Fred'
    },
    timeout: 10000, //毫秒 0 表示无超时时间
    responseType: 'json', //默认json 可以是 'arraybuffer', 'blob', 'document', 'json', 'text', 'stream' 
    responseEncoding: 'utf8' // default
}

//创建实例
let req=axios.create(cfg);
req.get("GetMonthDaChengRate",{
    params:{
        pt_class:"16"
    }
})
.then((x)=>{ //正确返回的结果
    console.log(x.data,x.status,x.statusText);
})
.catch(err=>{ //错误返回的结果
    console.log(err.message);
});

二、普通调用

axios也可以直接调用，不用先实例化

axios({
    url:"http://192.168.0.85:8074/api/ProjectDZJG/GetMonthDaChengRate", //url必填
    method:"get", //get or post
    params:{ //get的参数
        pt_class:"16"
    }
})
.then((x)=>{
    console.log(x.data);
})
.catch((err)=>{
    console.log(err.message);
});

三、批量（并发）调用

//批量执行
let request1=()=>{ return axios.get("http://192.168.0.85:8074/api/ProjectGYJJ/GetStartedWos"); };
let request2=()=>{ return axios.get("http://192.168.0.85:8074/api/ProjectDZJG/GetMonthDaChengRate",{ params:{pt_class:"16"} } ); }
axios.all([request1(),request2()])
.then(axios.spread( (r1,r2)=>{
    console.log(r1.data);
    console.log(r2.data);
} ));

参考地址：http://www.axios-js.com/zh-cn/docs/

axios的使用

发表评论