javascript - Promise 封裝ajax想順序執行ajax,但發現並沒有按照順序執行,高手指點
ringa_lee
ringa_lee 2017-05-31 10:38:42
0
8
850

#程式碼如下:

    function $myAjax(url, method, data, callback) {
        let p = new Promise(function(resolve, reject) {
            $Ajax.request({
                url: url,
                method: method,
                data: data,
                success: function(resp) {
                    callback(resp);
                    resolve();
                },
                failure: function(xhr) {
                    //todo
                    reject();
                }
            });
        });
        return p;
    }
    let $docs = document;
    $docs.getElementById('xxx').onclick = function() {
        $myAjax('https://mhd.uzai.com/api/CommonActive/GetPrizeGivingByUserid', 'get', { 'memberid': 1920740, 'activeid': 1 }, function(resp) {
            console.log(resp);
            console.log(1);
        }).then($myAjax('https://mhd.uzai.com/api/CommonActive/GetPrizeGivingByUserid', 'get', { 'memberid': 1920740, 'activeid': 1 }, function(resp) {
            console.log(resp);
            console.log(2);
        }));
    };`

也就是說有時候會先印出來2,然後再印出來1;

想要執行的順序是:1,2

請高手指點!

ringa_lee
ringa_lee

ringa_lee

全部回覆(8)
左手右手慢动作

額, 你這個寫錯了,正確寫法如下

$docs.getElementById('xxx').onclick = function() {
    $myAjax('https://mhd.uzai.com/api/CommonActive/GetPrizeGivingByUserid', 'get', { 'memberid': 1920740, 'activeid': 1 }, function(resp) {
        console.log(resp);
        console.log(1);
    }).then(function() {
        $myAjax('https://mhd.uzai.com/api/CommonActive/GetPrizeGivingByUserid', 'get', { 'memberid': 1920740, 'activeid': 1 }, function(resp) {
            console.log(resp);
            console.log(2);
        })
    });
};`
滿天的星座

雷雷

滿天的星座

你這寫法,就是說沒有調用reject函數,在成功觸發後,你的resp輸出的是什麼?

伊谢尔伦

你需要用數組來保證佇列,用reduce來保證傳回值的疊加操作。
然後自己實作promise

洪涛

推薦用終極方案 async。

巴扎黑

首先,你要理解一點,Promise不需要傳callback,Promise就是為了不傳callback回調的。
先看下Promise文法吧。

var promise=new Promise(function(resolve,reject){
    //这里面执行异步操作,
    //参数说明:resolve,reject都是function,异步成功了,执行resolve,失败了执行reject
    //此处使用setTimeout模拟一个ajax
    setTimeout(function () {
        resolve(testData);
    }, 1000);
})
promise.then(function success(){
//执行resolve就等于初始执行这个函数
},function error(){
//执行reject就等于初始执行这个函数
});

//多个then
//promise.then....

建議看看阮一峰寫的教學:Promise

洪涛

所有 promise 中的then 都是按順序調度立即執行,這些 then 中任意一個都無法影響或延誤對其他的呼叫。也就是你的第二個 ajax 是不會等第一個 ajax 請求晚再執行。 解決辦法

//ajax 的promise 封装
var ajax1 = new Promise((resolve,reject) => {
// request
})
var ajax2 = new Promise((resolve,reject) => {
// request
})
//调用

ajax1()
    .then(() => return ajax2())
    ....
世界只因有你

請貼出你的程式碼,而不是截圖,這是提問的一個小技巧哦,圖片不怎麼清晰。

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板
關於我們 免責聲明 Sitemap
PHP中文網:公益線上PHP培訓,幫助PHP學習者快速成長!