注意:

VUE中的方法调用顺序是依次进行的,方法体内部也是依次执行的,
但是,两个方法体的执行顺序并不能严格控制,不一定一个方法执行完再执行另一个
下面来说一下涉及到axios请求时的执行顺序

我们要求的执行顺序是:
发送axios请求,更新数据至数据库–》重新获取数据库中的更新后的数据
我的测试:
如果按下面这种格式写,执行出来的结果是更新之前的,
因为post方法还没执行完,getUserList方法就开始执行了(没有严格的控制执行顺序)

//发送axios请求,更新数据至数据库
this.$http.post('/login/updateUserStatus', userinfo)
//重新获取数据库中的更新后的数据
this.getUserList()

在这里插入图片描述

下面是解决上面这种问题的方法(有两种)
方法一:使用async和await修饰符,使方法调用和执行是同步的

//发送axios请求,更新数据至数据库
await this.$http.post('/login/updateUserStatus', userinfo)
//重新获取数据库中的更新后的数据
this.getUserList()

在这里插入图片描述
方法二:在axios后的语句写在axios.then中,就能确保数据返回之后执行

Logo

前往低代码交流专区

更多推荐