js異步問題，Promise解決回調地獄。

            // 獲取省
            getSheng() {
                return new Promise((resolve, reject) => {
                    axios.get(BASEURL + '/phone/Controllers/', {
                        params: {
                            _action: "1bd2b39b-c393-4dc9-81e3-2ad37076c461",
                        }
                    }).then(res => {
                        console.log(res);
                        resolve(res);
                    }).catch(error => {
                        console.log(error);
                        reject(error);
                    });
                })
            },
            // 獲取市
            getShi(e) {
                return new Promise((resolve, reject) => {
                    axios.get(BASEURL + '/phone/Controllers/', {
                        params: {
                            _action: "8826c52c-276e-4025-a158-c9333424cb90",
                            txtProvinceID: e//省份ID
                        }
                    }).then(res => {
                        console.log(res);
                        resolve(res);
                    }).catch(error => {
                        console.log(error);
                        reject(error);
                    });
                })
            },
            // 獲取區
            getQu(e) {
                return new Promise((resolve, reject) => {
                    axios.get(BASEURL + '/phone/Controllers/', {
                        params: {
                            _action: "b88132bd-be02-4be7-bb73-105430b594b1",
                            txtCityID: e//省份ID
                        }
                    }).then(res => {
                        console.log(res);
                        resolve(res);
                    }).catch(error => {
                        console.log(error);
                        reject(error);
                    });
            })

　　　　　　　　

              //調用

　　　　　　　　this.getSheng().then(res => {

                console.log(res);

                if (res.data.code == 1) {

                    this.$toast(res.data.msg);

                } else {

                    

　　　　　　　　　　　　this.option1 = res.data;

                    return this.getShi(res.data[0].value);

                }

                // return this.getShi();

            }).then(res => {

                console.log(res);

                if (res.data.code == 1) {

                    this.$toast(res.data.msg);

                } else {

　　　　　　　　　　　　this.option2 = res.data;

                    return this.getQu(res.data[0].value);

                }

                // return this.getQu();

            }).then(res => {

                console.log(res);

                if (res.data.code == 1) {

                    this.$toast(res.data.msg);

                } else {

                   

                    this.option3 = res.data;

                }

            });

function getUser(call,fail){

　　if(true){

　　　　call(1);

　　}else{

　　　　fail();

   }

}

　　function getGroup(a,call){
　　　　call(a)
　　}

getUser(function(response){
    getGroup(response.id, function(group){
      getDetails(groupd.id, function(details){
        console.log(details)
      },function(){
        alert('獲取分組詳情失敗')
      })
    }, function(){
      alert('獲取分組失敗')
    })
  }, function(){
  alert('獲取用戶信息失敗')
})

 

 

 1.  

真的，Promise 並不能消滅回調地獄，但是它可以使回調變得可控。你對比下面兩個寫法就知道了。

getGroup(response.id, success2, error2)

getGroup(response.id).then(success2, error2)

用 Promise 之前，你不能確定 success2 是第幾個參數；

2.

小結

Promise 的優點在於，讓回調函數變成了規范的鏈式寫法，程序流程可以看得很清楚。它有一整套接口，可以實現許多強大的功能，比如同時執行多個異步操作，等到它們的狀態都改變以后，再執行一個回調函數；再比如，為多個回調函數中拋出的錯誤，統一指定處理方法等等。

而且，Promise 還有一個傳統寫法沒有的好處：它的狀態一旦改變，無論何時查詢，都能得到這個狀態。這意味着，無論何時為 Promise 實例添加回調函數，該函數都能正確執行。所以，你不用擔心是否錯過了某個事件或信號。如果是傳統寫法，通過監聽事件來執行回調函數，一旦錯過了事件，再添加回調函數是不會執行的。

Promise 的缺點是，編寫的難度比傳統寫法高，而且閱讀代碼也不是一眼可以看懂。你只會看到一堆then，必須自己在then的回調函數里面理清邏輯。

 

 

 

參考：https://javascript.ruanyifeng.com/advanced/promise.html#toc0

https://www.cnblogs.com/whybxy/p/7645578.html