var dfd = $.Deferred();
//第一步
setTimeout(function(){
dfd.resolve(10);
},1000);
//第二步等待第一步返回后执行
dfd.then(function(data){
console.log('Step1 Result:'+data); //第一步的结果 10
return setTimeout(function(){
return data*data; // 第二步的结果 100 这里如何将100返回到第三步能用
},1000);
})
//第三步等待第二部返回的结果执行
.then(function(data){
console.log('Step2 Result:'+data); //这里如何获取第二步的结果?
})
你第2步需要返回一个 promise/deffered,我把你的代码改了下
var dfd = $.Deferred();
//第一步
setTimeout(function() {
dfd.resolve(10);
}, 1000);
//第二步等待第一步返回后执行
dfd.then(function(data) {
console.log('Step1 Result:' + data); //第一步的结果 10
var d2 = $.Deferred(); // [viyi]
setTimeout(function() { // [viyi] 这里去掉了 Return
d2.resolve(data * data); // [viyi]
// return data * data; // 第二步的结果 100 这里如何将100返回到第三步能用
}, 1000);
return d2.promise(); // [viyi]
})
//第三步等待第二部返回的结果执行
.then(function(data) {
console.log('Step2 Result:' + data); //这里如何获取第二步的结果?
})
问题出在这里:return setTimeout(function() {...})
,因为 setTimeout
的返回值是一个 timeoutID,而不是内部回调的返回值,所以你在第三步里接收到的 data
其实是那个 timeoutID,而内部回调返回的值则被淹没了
这问题的本质在于你第二步想要返回的不是一个直接值,而是一个异步调用,为了返回正确的结果,你可以把这个异步调用也用 Promise 封装一下,最后返回这个 promise 对象(也就是 jQuery 里面的 deferred 对象)即可。
// 第二步
dfd.then(function(data) {
var deferred = $.Deferred();
setTimeout(function(){
deferred.resolve(data * data);
}, 1000);
return deferred;
})
return setTimeout(function(){
return data+1; // 第二步的结果 2 这里如何将data+1返回到第三步能用
},1000);
@changweihua
我将代码中的值稍微改了一下 你帮我看看 谢谢