promise链式调用 (回调地狱)

369 阅读1分钟
      <!-- 
        Promise链式调用
          引入: 三个异步网络请求,后面请求需要前面请求的结果,
            回调嵌套
            myAjax({
                method:'get',
                url:'第一个url',
                success:function(result){
                    myAjax({
                        method:'post',
                        url:'第二个url',
                        success:function(result){
                                myAjax({
                                    method:'get',
                                    url:'第三个url',
                                    success:function(result){
                                        myAjax({
                                            method:'get',
                                            url:'第三个url',
                                            success:function(result){
                                            }
                                        })
                                    }
                                })
                        }
                    })
                }
            })

        Promise链式调用:
            
            myAjaxPromise({
                method:'get',
                url:'第一个请求'
            }).then(result1=>{
               return myAjaxPromise({
                    method:'get',
                    url:'第二个请求'
                })
            }).then(result2=>{
               return myAjaxPromise({
                    method:'get',
                    url:'第三个请求'
                })
            }).then(result3=>{
                //result3
            })

           

            
              
     -->
    myAjaxPromise({
            method: 'get',
            url: '第一个请求'
        }).then(result1 => {
            return myAjaxPromise({
                method: 'get',
                url: '第二个请求'
            })
        }).then(result2 => {
            return myAjaxPromise({
                method: 'get',
                url: '第三个请求'
            })
        }).then(result3 => {
            //result3
        }).catch(err=>{
            //err
        })