jQuery 延迟未按预期工作

Question

这是我第一次使用 $.Deferred();，事实证明这是一项使命。

我已阅读 jQuery Deferred not working，但这适用于 ajax 事件，因此对我的情况没有真正帮助。

我在javascript中有以下代码：

var deferred = $.Deferred();

deferred.done(function() {
    console.log(auth.loggedIn);
    if(auth.loggedIn) {
        app.page = 'usr/dashboard';
    }
}

deferred.resolve(auth.initialize());

我的 auth 对象如下所示：

var auth = {

    loggedIn:false,

    initialize:function() {
        var data = {
            'login_token':app.getCookie('login_token'),
            'usr_id':app.getCookie('usr_id'),
            'source':config.source,
            'language_code':config.language_code,
            'country_code':config.country_code
        }
        app.api('usr/loggedin',data,function(data) {
            var response = JSON.parse(data);
            if(!response.result) {
                auth.loggedIn = false;
            }
            auth.loggedIn = true;
            console.log(auth.loggedIn);
        },'post');
    }
}

现在，如果我 console.log(response) 在 app.api 回调中，响应正是我所期望的，如果我 console.log(auth.loggedIn) 我得到 true。

如果我在 deferred.done 和 console.log(auth.loggedIn) 中 console.log （在 initialize 中我得到两个不同的值。我做错了什么以及如何让我的应用程序等待要设置 auth.loggedIn?

更新

这就是我现在在主文件中的做法：

auth.initialize().done(function(auth) {
    if(auth.loggedIn) {
        app.page = 'usr/dashboard';
    }
    jsRouter.initialize();
});

jsRouter基于this 20 line javascript router，现在只偶尔显示模板页面，不管我在哪个页面。

jsRouter.initialize 函数如下所示：

initialize:function() {
    window.addEventListener('hashchange',jsRouter.router);
    window.addEventListener('load',jsRouter.router);

    /* ERROR PAGES */
    jsRouter.route('404','errors/404',function() {});
    jsRouter.route('500','errors/500',function() {});

    /* ACTUAL PAGES */
    jsRouter.route('/','home',function() {});
    jsRouter.route('/home','home',function() {});
    jsRouter.route('/usr/register','usr/register',function() {});
    jsRouter.route('/usr/login','usr/login',function() {});
    jsRouter.route('/usr/forgotpassword','usr/forgotpassword',function() {});
    jsRouter.route('/usr/activate','usr/activate',function() {});
    jsRouter.route('/usr/dashboard','usr/dashboard',function() {});
    jsRouter.route('/adr','adr/index',function() {});
},

我已经更新了我的 app.api 回调，使其看起来与建议的完全一样。

Answer 1

您目前正在用 undefined 解析延迟对象，这没有意义。您还在执行 app.api 回调之前解决它。延迟对象必须由异步回调解决。

auth.initialize 应该 return 延迟对象/承诺，你必须在 app.api 回调中解决它：

var auth = {

    loggedIn:false,

    initialize:function() {
       var deferred = new $.Deferred();          // <- create deferred object
        var data = {
            'login_token':app.getCookie('login_token'),
            'usr_id':app.getCookie('usr_id'),
            'source':config.source,
            'language_code':config.language_code,
            'country_code':config.country_code
        }
        app.api('usr/loggedin',data,function(data) {
            auth.loggedIn = JSON.parse(data).result;
            deferred.resolve(auth);              // <- resolve when response was received
        },'post');
        return deferred.promise();               // <- return promise
    }
}

auth.initilize().done(function(auth) { 
  // at this point the login succeeded (or failed)
});

jQuery 延迟未按预期工作

jQuery Deferred not working as expected

javascript

jquery

deferred

更新