当前位置:首页 > 前端 > 正文内容

多then依次执行

Z先生5年前 (2021-06-21)前端840

应用场景:

我们有一个A方法ajax方法获得用户信息,我们还有一个B方法是马上要使用用户信息,当两个方法同时调用时候,我们无法判别B方法已经拿到A方法的ajax获取的用户信息,基于这样的需求,我们急需一个能让他们按照A->B的顺序同步执行的东西。

解决办法:

es6的Promise对象是可以实现同步操作的,这解决了ajax请求想同步按照顺序执行的问题。

new Promise((resolve, reject) => {
    console.log(1)
    resolve({
        name: "第1个传递的值"
    });
}).then((result) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(2, result)
            resolve({
                name: "第2个传递的值"
            })
        }, 1000)
    })
}).then((result) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(3, result)
            resolve({
                name: "第3个传递的值"
            })
        }, 1000)
    })
}).then((result) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(4, result)
            resolve({
                name: "第4个传递的值"
            })
        }, 1000)
    })
}).then((result) => {
    return new Promise((resolve, reject) => {
        setTimeout(() => {
            console.log(5, result)
        }, 1000)
    })
})
分享给朋友:

相关文章

小程序二维码传参处理&UNIAPP H5传参兼容处理

首先小程序生成二维码,我这里调用的接口是:getUnlimited,我传递的参数是:invite=10001接着就是小程序中处理,如果直接扫二维码在App.vue的onLaunch中,使用decode...

HTML5桌面通知开启代码片段

<script type="text/javascript"> function showmsg() {   &n...

npm如何使用国内镜像源?

通过命令配置1. 命令淘宝源npm config set registry https://registry.npmmirror.com腾讯源npm ...

VUE打包时from UglifyJs Unexpected token: punc (()错误解决方案

归其原因是因为缺少ES2015的语法解析。因此进行如下2步操作即可解决问题:1、安装babel-preset-es2015npm install babel-preset-es20...

uniapp开发小程序,小程序二维传参与H5、分享页面参数兼容的处理方案。

首先小程序获取二维码接口有三个,2个限制数量,一个不限制数量,但是限制生成频率(5000次/分钟)和参数长度(32位),我使用的是不限数量的接口:getUnlimited,传递的参数为:invite=...

npm删除掉所有模块并重新安装的方法

1、删除目录:node_modules2、运行清理命令npm cache clean -f3、安装npm install...

发表评论

访客

◎欢迎参与讨论,请在这里发表您的看法和观点。