vue fetch中的.then()的正确使用方法
更新时间：2020年04月17日 09:13:29 作者：风华正茂百花洲
这篇文章主要介绍了vue fetch中的.then()的正确使用方法，文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值，需要的朋友们下面随着小编来一起学习学习吧
先看一段代码：
fetch('http://localhost:3000/books?id=123456',{
method:'get'
})
.then(function(value1){
console.log(value1);
return 'hello';
})
.then(function(value2){
console.log(value2);
return 'HelloWorld';
})
/*
.then(function(data){
console.log(data);
return data.text();
})
*/
.then(data=>{
console.log(data);
})
// 接口
app.get('/books', (req, res) => {
res.send('传统的URL传递参数!' + req.query.id)
})
在这段代码中我们发现，最初传入的是一个对象，紧接着后一个.then()的传入参数使用了前一个.then()的返回值，换句话说，就是后一个then使用前一个then的封装结果
那么现在去掉注释：
.then(function(value2){
console.log(value2);
return 'HelloWorld';
})
.then(function(data){
console.log(data);
return data.text();
})
text()方法属于fetch API的一部分，返回一个Promise实例对象，用于获取后台返回的数据
这段代码中，传入的data是上一步封装的字符串，所以此时用data.text()报错，除非data为对象
下面演示正确使用方式：
fetch('http://localhost:3000/books?id=123456',{
method:'get'
})
.then(function(data){
console.log(data);
console.log(typeof(data));
return data.text();
})
.then(data=>{
console.log(data);
console.log(typeof(data));
})
输出了接口询问的内容，为String类型
到此这篇关于vue fetch中的.then()的正确使用方法的文章就介绍到这了,更多相关vue fetch .then()内容请搜索脚本之家以前的文章或继续浏览下面的相关文章希望大家以后多多支持脚本之家！
相关文章
近期,发现点击修改,element ui 的图片没有回显到框中,所以本文给大家介绍了Element plus实现图片手动上传与回显的过程,文中通过代码示例给大家介绍的非常详细,具有一定的参考价值,需要的朋友可以参考下2024-09-09
这篇文章主要介绍了vue 如何处理防止按钮重复点击问题，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-10-10
这篇文章主要介绍了vue接入腾讯防水墙代码，代码超级简单，非常不错，具有一定的参考借鉴价值 ,需要的朋友可以参考下2019-05-05
如果在面试中，面试官问你Vue组件之间有哪些数据通信方式，你会怎么回复，不要担心，本文为大家整理了超全的Vue3中组件数据通信方式，需要的小伙伴快收藏起来吧2023-06-06
今天小编就为大家分享一篇浅谈在vue中使用mint-ui swipe遇到的问题，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2018-09-09
这篇文章主要介绍了vue学习笔记之slot插槽用法,结合实例形式对比分析了vue使用slot插槽的相关操作技巧与注意事项,需要的朋友可以参考下2020-02-02
vue作为前端主流的3大框架之一,目前在国内有着非常广泛的应用,下面这篇文章主要给大家介绍了关于vue3组合式api实现v-lazy图片懒加载的相关资料,需要的朋友可以参考下2022-09-09
这篇文章主要介绍了vue中使用axios固定url请求前缀的实现方式，具有很好的参考价值，希望对大家有所帮助。如有错误或未考虑完全的地方，望不吝赐教2022-12-12
这篇文章主要介绍了vue如何将v-for中的表格导出来,需要的朋友可以参考下2018-05-05
VUE3使用Element-Plus时如何修改ElMessage中的文字大小
在使用Element-plus的Elmessage时使用默认的size无法满足我们的需求时,我们可以自定义字体的大小,但是直接重写样式后,并没有起作用,甚至使用::v-deep深度选择器也没有效果,本文介绍VUE3使用Element-Plus时如何修改ElMessage中的文字大小,感兴趣的朋友一起看看吧2023-09-09
最新评论