Jquery Promise 和 Defered 返回结果
Jquery Promise and Defered with returned results
我正在使用 Backbone.js 并且我有许多事件,这些事件为我的路由器中的选项对象生成设置。被调用的视图需要这些对象,因此它们必须在创建视图之前完成。问题是发生的这些事件是 ajax 并且是异步的,因此它们不会在显示视图之前完成。我试着让事件同步,但这会导致其他问题,比如冻结 gui。所以,我试图链接我的函数,以便在调用所有函数之前创建视图。但是,这对我不起作用,因为我似乎无法弄清楚如何在延迟调用之间传递数据。这是我拥有的:
Router.js:
someParentFunction:function(paramA, paramB){
var that = this;
var defer1 = $.when(
$.get(that.functionA('somedata1','somedata2',that))
);
defer1.done(function () {
var defer2 = $.when(
$.get(that.functionB('someData',that))
);
defer2.done(function (data) {
var defer3 = $.when(
$.get(that.functionC('somedata1',that))
);
defer3.done(function (data) {
//how do I get the results from each Deferred function?
//keeling in mind that each deferred function
//also receives parameters.
//also, the order of the other functions does not matter,
//as long as they all return their values before this
//view is created.
that.view = new ProjectView({
someParam1:paramA,
someParam2:paramB,
resultsA: jQuery.parseJSON(defer1.results),
resultsB: jQuery.parseJSON(defer2.results),
resultsC: jQuery.parseJSON(defer3.results),
}),
window.app.page(that.view, {
tab:'someName',
})
});
});
});
}
functionA: function(param1, param2){
var url = '?q=somestring&' + param1 + '&' + param2 ;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
);
}
}).success(function( data ) {
}).responseText;
},
functionB: function(param1, context){
var url = '?q=somestring&' + param1 ;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
);
}
}).success(function( data ) {
}).responseText;
},
functionC: function(param1, context){
var url = '?q=somestring&' + param1;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
);
}
}).success(function( data ) {
}).responseText;
},
经过一段时间的研究,我发现这是可行的:
var that = this
$.when(
that.functionA(param1,that) ,
that.functionB(param1,that) ,
that.functionC(that) ,
that.functionD(param1,that) ,
that.functionE(param1,that) ,
that.functionF(param1,that, param2)
).done(function( a1, a2 , a3, a4, a5, a6) {
var response1 = jQuery.parseJSON(a1[0].result.results);
var response2 = jQuery.parseJSON(a2[0].result.results);
var response3 = jQuery.parseJSON(a3[0].result.results);
var response4 = jQuery.parseJSON(a4[0].result.results);
var response5 = jQuery.parseJSON(a5[0].result.results);
var response6 = jQuery.parseJSON(a6[0].result.results);
that.view = new MyView({
someParam:param1,
anotherParam:param2,
r1: response1,
r2: response2,
r3: response3,
r4: response4,
r5: response5,
r6: response6
}),
window.app.page(that.view, {
tab:'someValue',
})
});
然后每个函数的结构如下:
functionA: function(param1, context){
var url = '?q=myApp/api/general_functions/¶m1=' + param1;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
}
}).success(function( data ) {
});
},
这确保了包装在 .when 方法中的每个函数在到达 .done 方法之前完成。
希望这对其他人有帮助。
我正在使用 Backbone.js 并且我有许多事件,这些事件为我的路由器中的选项对象生成设置。被调用的视图需要这些对象,因此它们必须在创建视图之前完成。问题是发生的这些事件是 ajax 并且是异步的,因此它们不会在显示视图之前完成。我试着让事件同步,但这会导致其他问题,比如冻结 gui。所以,我试图链接我的函数,以便在调用所有函数之前创建视图。但是,这对我不起作用,因为我似乎无法弄清楚如何在延迟调用之间传递数据。这是我拥有的:
Router.js:
someParentFunction:function(paramA, paramB){
var that = this;
var defer1 = $.when(
$.get(that.functionA('somedata1','somedata2',that))
);
defer1.done(function () {
var defer2 = $.when(
$.get(that.functionB('someData',that))
);
defer2.done(function (data) {
var defer3 = $.when(
$.get(that.functionC('somedata1',that))
);
defer3.done(function (data) {
//how do I get the results from each Deferred function?
//keeling in mind that each deferred function
//also receives parameters.
//also, the order of the other functions does not matter,
//as long as they all return their values before this
//view is created.
that.view = new ProjectView({
someParam1:paramA,
someParam2:paramB,
resultsA: jQuery.parseJSON(defer1.results),
resultsB: jQuery.parseJSON(defer2.results),
resultsC: jQuery.parseJSON(defer3.results),
}),
window.app.page(that.view, {
tab:'someName',
})
});
});
});
}
functionA: function(param1, param2){
var url = '?q=somestring&' + param1 + '&' + param2 ;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
);
}
}).success(function( data ) {
}).responseText;
},
functionB: function(param1, context){
var url = '?q=somestring&' + param1 ;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
);
}
}).success(function( data ) {
}).responseText;
},
functionC: function(param1, context){
var url = '?q=somestring&' + param1;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
);
}
}).success(function( data ) {
}).responseText;
},
经过一段时间的研究,我发现这是可行的:
var that = this
$.when(
that.functionA(param1,that) ,
that.functionB(param1,that) ,
that.functionC(that) ,
that.functionD(param1,that) ,
that.functionE(param1,that) ,
that.functionF(param1,that, param2)
).done(function( a1, a2 , a3, a4, a5, a6) {
var response1 = jQuery.parseJSON(a1[0].result.results);
var response2 = jQuery.parseJSON(a2[0].result.results);
var response3 = jQuery.parseJSON(a3[0].result.results);
var response4 = jQuery.parseJSON(a4[0].result.results);
var response5 = jQuery.parseJSON(a5[0].result.results);
var response6 = jQuery.parseJSON(a6[0].result.results);
that.view = new MyView({
someParam:param1,
anotherParam:param2,
r1: response1,
r2: response2,
r3: response3,
r4: response4,
r5: response5,
r6: response6
}),
window.app.page(that.view, {
tab:'someValue',
})
});
然后每个函数的结构如下:
functionA: function(param1, context){
var url = '?q=myApp/api/general_functions/¶m1=' + param1;
return $.ajax({
url: url,
context: context,
beforeSend: function( xhr ) {
}
}).success(function( data ) {
});
},
这确保了包装在 .when 方法中的每个函数在到达 .done 方法之前完成。
希望这对其他人有帮助。