在 AJAX 请求中返回回调并在 Promise 链中调用回调

Question

我在做一个 react 项目，出现了以下三个案例。有人可以给我一些关于使用 axios 和 redux-promise 发出 AJAX 请求时的区别的指示吗？

Case 1 (the payload is undefined - why?): 
axios.get(link) 
.then(callback)

Case 2 (the payload is also undefined - why?): 
axios.get(link)
.then(() => callback())

Case 3 (the payload is the res object): 
axios.get(link)
.then((res) => { callback; return res });

如果有人能回答这个问题或给我指点可以消除我的困惑的材料，我将不胜感激。在我将问题发布到 SO 之前，我做了最好的研究并花了几个小时。谢谢！

Answer 1

您在前两个 promise 中的解析值是 undefined，因为您有一个 .then() 处理程序，您不会从中返回任何内容。 .then() 处理程序的 return 值成为承诺链的解析值。

如果您希望 link 成为 promise 的已解析值并且您将拥有自己的 .then() 处理程序，那么您必须返回它。

案例 1：

axios.get(link).then(callback)

在这里，您将.then() 处理程序委托给回调函数。除非它返回传递给它的值（显然它没有返回），否则 .then() 处理程序的返回值是 undefined，因此这就是 promise 链的解析值。

情况1等价于：

axios.get(link).then(function(val) {
    return callback(val);
});

因此，promise 链将 callback(val) 返回的任何值作为解析值。

案例 2：

axios.get(link).then(() => callback())

在这里，我们可以清楚地看到.then() 箭头函数处理程序的返回值是执行callback() 的结果，显然是undefined，因此promise 链采用undefined 的解析值。

你可以通过这样做来解决这个问题：

axios.get(link).then(() => {
    callback()
    return link;
});

案例 3：

axios.get(link).then((res) => { callback; return res });

这里你明确地返回res，这样它就变成了promise链的解析值。你甚至没有打电话给callback()。我猜你的意思是在它后面加上()。

不要将简单的回调与承诺混在一起

您可能也不希望将普通回调与 Promise 混合使用，它们是异步通知的两种不同方法，在给定的代码部分中仅使用一种技术要好得多。相反，将回调操作转换为返回一个在回调正常调用时解决的承诺。然后，您可以将 Promise 链接起来。

或者，如果您试图通知某个调用者有关操作的完成，那么让他们在返回的 Promise 上使用自己的 .then() 处理程序查看返回的 Promise。