欢迎来到尧图网

客户服务 关于我们

您的位置:首页 > 教育 > 锐评 > 前端(Axios和Promis)

前端(Axios和Promis)

2025/2/22 16:33:20 来源:https://blog.csdn.net/m0_67244960/article/details/144446351  浏览:    关键词:前端(Axios和Promis)

Promise

语法

 <script>// 创建promise对象// 此函数需要再传入两个参数,都是函数类型let p=new Promise((resolve,reject)=>{if(3>2){resolve({name:"李思蕾",age:23,地址:"河南省"});}else{reject("error");}});console.log(p);p.then((o)=>{console.log(o)},(e)=>{console.log(e)})</script>

Promise封装Ajax

<script>let p=new Promise((resolve,reject)=>{let xhr=new XMLHttpRequest();xhr.open("get","https://jsonplaceholder.typicode.com/users");xhr.send();xhr.onreadystatechange=function(){if(xhr.readyState==4){if(xhr.status==200){resolve(xhr.response);}else{reject("获取失败")}}}});p.then(a=>{console.log(a)},b=>{console.log(b)})
</script>

Axios

语法

服务器Server.js(处理请求,并响应数据)

<script>let data=axios.get("http://localhost:3000",{params:{name:"李四",age:24}})data.then((a)=>{console.log(a.data)//请求成功后的数据},(b)=>{console.log("error")//请求失败后提示})
</script>
 客户端向服务器发送请求 
<script>let person=[{name:"李四",age:24},{name:"李四",age:24},{name:"李四",age:24},{name:"李四",age:24},{name:"李四",age:24},{name:"李四",age:24},{name:"李四",age:24}]let data=axios.get("http://localhost:3000",{params:person})data.then((a)=>{console.log(a.data)//请求成功后的数据},(b)=>{console.log("error")//请求失败后提示})
</script>
优化后Axios写法 
<script>let person=[{name:"王五",age:24}]let http=axios.create({baseURL:'http://localhost:3000'});let p= http.get("",{params:person})p.then((a)=>{console.log(a.data)//请求成功后的数据},(b)=>{console.log("error")//请求失败后提示})
</script>
拦截器 
<script>let person=[{name:"王五",age:24}]let http=axios.create({baseURL:'http://localhost:3000'});http.interceptors.request.use((request)=>{return request})http.interceptors.response.use((response)=>{return response.data;})let p=http.get("",{params:person})p.then((a)=>{console.log(a)//请求成功后的数据},(b)=>{console.log("error")//请求失败后提示})
</script>

版权声明:

本网仅为发布的内容提供存储空间,不对发表、转载的内容提供任何形式的保证。凡本网注明“来源:XXX网络”的作品,均转载自其它媒体,著作权归作者所有,商业转载请联系作者获得授权,非商业转载请注明出处。

我们尊重并感谢每一位作者,均已注明文章来源和作者。如因作品内容、版权或其它问题,请及时与我们联系,联系邮箱:809451989@qq.com,投稿邮箱:809451989@qq.com

热搜词