axios实现同步请求

ゝ一纸荒年。 2023-10-11 15:54 25阅读 0赞

如何实现ajax请求的同步？

*  通过jquery发送，将async属性设置为false，这样就会发送同步请求
 *  在axios中，所有的请求都是异步发送的。所以单独用axios是实现不了同步的，需要结合async与await关键字使用。

var data = {
        }
    axios.get("./data1.json")
    	.then(res => data = res.data)
    console.log(data)

如果我们的代码是这个顺序，则data还是个空对象，是获取不到的。

*  async 与 await  
    async是修饰函数的，async修饰的函数的返回值是promise对象，这个promise对象的状态与值具体要看被修饰的函数的返回值，如果被修饰的函数的返回值为非promise对象，那该函数返回的promise对象的状态为成功，成功的值就是返回值，如果被修饰的函数返回的是一个promise对象，则的返回的promise对象的值与状态由函数return后的promise对象的状态和值决定。

await 必须用在async函数中，await 后修饰的是一个promise对象，await返回的值，就是promise对象成功的值。

async function init(){
        
    
    	var data = {
        }
    	var res = await axios.get("./data1.json")
    	data = res.data
    	console.log(data)
    
    }
    
    init()

这样axios请求就成了同步的，axios请求本身返回的就是一个promise对象，await语句可以将promise对象成功的值返回出去，也就是这里的res就是axios请求成功的值。  
这样就可以同步获取结果了。

在vue中可以这样用

new Vue({
        
    		methods:{
        
    			async listData(){
        
    				var res = await axios.post(xxxx)
    				console.log(res)
    			}
    		}
    	})

发表评论取消回复

表情：

评论列表（有 0 条评论，25人围观）

还没有评论，来说两句吧...

相关阅读

相关 axios实现同步请求

如何实现ajax请求的同步？通过jquery发送，将async属性设置为false，这样就会发送同步请求在axios中，所有的请求都是异步发送的。所以单独用a

ゝ一纸荒年。/ 2023年10月11日 15:54/ 0 赞/ 26 阅读

相关【axios】002-axios发起请求

目录一、axios常用语法二、请求配置三、发送Get请求四、发送Post请求五、执行多个并发请求 -------------------- 一、axi

喜欢ヅ旅行/ 2023年10月05日 12:07/ 0 赞/ 59 阅读

相关 vue axios同步请求解决方案

　　在vue项目里面，需要循环发送ajax请求，出现的问题就是循环结束，第一次服务器还没返回，导致数据处理错误，需要使用同步请求　　解决方案　　目前没有发现axios可

傷城~/ 2023年09月25日 12:11/ 0 赞/ 189 阅读

相关解决axios异步请求问题（异步变为同步）

遇到的问题 > 在目前一个需求中，我需要等待axios请求完成后，判断请求是否出现异常，然后来判断是否关闭弹窗修改后大概代码如下： async submit

悠悠/ 2023年09月24日 17:19/ 0 赞/ 115 阅读

相关 Axios 如何实现请求重试？

在 [Axios 如何取消重复请求？][Axios] 这篇文章中，阿宝哥介绍了在 Axios 中如何取消重复请求及 `CancelToken` 的工作原理。而本文将介绍在 Ax

男娘i/ 2023年01月15日 14:27/ 0 赞/ 493 阅读

相关 axios关于同步执行ajax请求方法

axios关于同步执行ajax请求方法调用函数要申明前缀async 内部函数调用要用await // 上传图片 OK async Upload

待我称王封你为后i/ 2022年12月21日 12:57/ 0 赞/ 498 阅读

相关使用axios方式实现Ajax请求

> 项目已开源至gitee：[https://gitee.com/guo-qianliang/es6-vue-node.js][https_gitee.com_guo-qian

r囧r小猫/ 2022年11月17日 13:37/ 0 赞/ 557 阅读

相关 Vue-如何使用axios实现同步请求

getInfoFn: async function(){ var that = this; await that.$api.sched

淩亂°似流年/ 2022年10月24日 11:42/ 0 赞/ 378 阅读

相关 axios 请求取消及其实现过程

一、axios 请求取消 1. `axios` 请求取消，代码如下所示： <!DOCTYPE html> <html lang="en"> <

怼烎@/ 2022年08月31日 12:21/ 0 赞/ 271 阅读

相关 axios 请求发送及其实现过程

一、axios 请求发送 1. `axios` 请求发送，代码如下所示： <!DOCTYPE html> <html lang="en"> <

你的名字/ 2022年08月31日 12:21/ 0 赞/ 359 阅读