axios数据交互、拦截器

最新推荐文章于 2024-05-13 17:31:43 发布

Ensoleile2021

最新推荐文章于 2024-05-13 17:31:43 发布

阅读量269

点赞数

文章标签：交互前端 javascript

本文链接：https://blog.csdn.net/weixin_51525398/article/details/121012701

版权

本文介绍了axios，一个基于promise的HTTP库，可用于前端和后端。详细讲解了axios的get和post请求用法，以及如何读取PHP接口。此外，还探讨了并发处理，如axios.all和axios.spread的使用。文章核心内容聚焦于axios的拦截器，包括请求拦截器（用于全局修改请求配置，如添加token）和响应拦截器（用于处理返回数据，如添加公共信息或处理登录状态）。

摘要由CSDN通过智能技术生成

概念：
一个基于 promise 的第三方库，可以用在浏览器（前端）和 node.js（后端）中
格式：

Promise axios({
        url : “地址“ 
		method: “ 提交方式”
		params：{} 地址栏携带的数据（get方式）
		data:{} 非地址栏携带数据（如：post，put等等）,
		baseURL：如果url不是绝对地址，那么将会加在其前面。当axios使用相对地址时这个设置非常方便
}).then(res=>{
    console.log(res.data);
})

axios的完整格式

axios({配置}).then(成功回调(res)).catch(失败回调(res))
axios.get(url,{配置}).then(成功回调(res)).catch(失败回调(res))
axios.post(url,{配置}).then(成功回调(res)).catch(失败回调(res))

get请求：

axios({
        url:'getGoodsListNew.php',
       	 // method:'get',  默认是get请求
        params:{
			count:3
		}
})
.then(res=>this.goodslist=res.data);

 axios.all([
            axios.get("/booklist?id="+this.$route.pa