vue中Promise的用法

Posted 2023-04-27

tags:

篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了vue中Promise的用法相关的知识，希望对你有一定的参考价值。

参考技术A promise是什么？
1、主要用于异步计算
2、可以将异步操作队列化，按照期望的顺序执行，返回符合预期的结果
3、可以在对象之间传递和操作promise，帮助我们处理队列

为什么会有promise？
为了避免界面冻结（任务）

同步：假设你去了一家饭店，找个位置，叫来服务员，这个时候服务员对你说，对不起我是“同步”服务员，我要服务完这张桌子才能招呼你。那桌客人明明已经吃上了，你只是想要个菜单，这么小的动作，服务员却要你等到别人的一个大动作完成之后，才能再来招呼你，这个便是同步的问题：也就是“顺序交付的工作1234，必须按照1234的顺序完成”。
异步：则是将耗时很长的A交付的工作交给系统之后，就去继续做B交付的工作，。等到系统完成了前面的工作之后，再通过回调或者事件，继续做A剩下的工作。
AB工作的完成顺序，和交付他们的时间顺序无关，所以叫“异步”。

Promise的基本用法

1.Promise是什么？

Promise是异步编程的一种解决方案，在ES6中Promise被列为了正式规范，统一了用法，原生提供了Promise对象。

Promise打印出来的详细信息

2.Promise的基本用法

then中成功失败的执行

// resolve代表成功 reject失败 都是一个函数

let p = new Promise(function(reslove,reject){

    //reslove(‘成功‘)  //状态由等待变为成功，传的参数作为then函数中成功函数的实参

    reject(‘失败‘)  //状态由等待变为失败，传的参数作为then函数中失败函数的实参

})

//then中有2个参数，第一个参数是状态变为成功后应该执行的回调函数，第二个参数是状态变为失败后应该执行的回调函数。

p.then((data)=>{

    console.log(‘成功‘+data)

},(err)=>{

    console.log(‘失败‘+err)

})

Promise承诺：默认情况下是等待状态pending，如果有一天状态转变为成功就成功了，如果状态变成失败就失败了。状态一旦改变了就不能再改变了。

如果then中返回了一个promise 会将promise的结果继续传给第二then中（如果结果是将状态改成成功就走下一个then的成功回调，状态改为失败就走下一个then的失败回调）

作者：新叶子
链接：https://www.jianshu.com/p/3023a9372e5f
来源：简书
著作权归作者所有。商业转载请联系作者获得授权，非商业转载请注明出处。

以上是关于vue中Promise的用法的主要内容，如果未能解决你的问题，请参考以下文章

多个请求执行完再执行下一个方法（vue Promise.all用法）

Promise的用法以及作用

ES6----Promise基本用法

VUE04_Promise的概述常用API静态方法axios基于不同请求传参拦截器async/await用法

Vue--Promise的基本使用

Vue全家桶之前后端交互