2 回答

TA貢獻(xiàn)1780條經(jīng)驗(yàn) 獲得超4個(gè)贊
你不是在等待res.json()返回的承諾。Promise.all()您可以在您的結(jié)果上添加另一個(gè),.map()或者您可以將它們烘焙到您使用的原始承諾中Promise.all()。后者是我的建議:
function fetchJSON(...args) {
return fetch(...args).then(response => {
if (!response.ok) {
throw new Error(`Error ${response.status}`);
}
return response.json();
});
}
getData: function() {
Promise.all([
fetchJSON('@Url.Action("GetSomething")', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify(this.selectedValues)
}),
fetchJSON('@Url.Action("GetSomethingElse")', {
method: 'POST',
headers: {'Content-Type': 'application/json'},
body: JSON.stringify(this.selectedValues)
})
]).then(responseArray => {
console.log("LOG: ", responseArray);
// use responseArray here
}).catch(error => {
console.log(error);
});
},
僅供參考,我經(jīng)常發(fā)現(xiàn)使用檢索響應(yīng)fetch()是不必要的冗長,因此最終使用某種輔助函數(shù),如fetchJSON()我在這里使用的,以防止重復(fù)代碼。
在我看來,fetch()
界面應(yīng)該提供兩件事。
一個(gè)選項(xiàng),讓您告訴它如果不是 2xx 狀態(tài),您希望它拒絕。我理解在這種情況下并不總是拒絕的用例,但可能有更多用例您希望它拒絕,所以它應(yīng)該是一個(gè)選項(xiàng)。
告訴它讀取響應(yīng)并以文本、json 或其他類型返回的選項(xiàng),因此您不必再進(jìn)行另一個(gè)承諾返回函數(shù)調(diào)用來執(zhí)行此操作。
僅供參考,request-promise
nodejs 的模塊,具有這兩個(gè)選項(xiàng)(因?yàn)樗鼈兘?jīng)常需要)。
但是,由于它沒有這些選項(xiàng)(盡管它們經(jīng)常需要),我們有時(shí)必須將其包裝以添加這些選項(xiàng)以避免重復(fù)代碼。在這種情況下,如果不是 2xx 狀態(tài),您希望它拒絕,并且您希望它讀取和解析 JSON,并且您希望在兩個(gè)地方執(zhí)行此操作,因此我們制作了一個(gè)小型實(shí)用程序函數(shù)來執(zhí)行此操作。

TA貢獻(xiàn)1809條經(jīng)驗(yàn) 獲得超8個(gè)贊
在回調(diào)中返回一個(gè)Promise 會(huì)導(dǎo)致在鏈then中的 next 中解決 Promise 。then
然而,這里返回了一個(gè) promise 數(shù)組,promise 沒有在 next 中解決then:
return responses.map(response => {
return response.json();
});
應(yīng)該有另一個(gè)Promise.all并行解決它們:
return Promise.all(responses.map(response => {
return response.json();
}));
或者可以將其重寫為使用for循環(huán)的順序處理,因?yàn)樵诎l(fā)出請求后預(yù)計(jì)并行性不會(huì)有明顯的改進(jìn)。
無論如何,async..await使這更簡單:
async getData() {
try {
const responses = await Promise.all([
fetch(...),
fetch(...)
]);
const responseArray = [];
for (const response of responses) {
if (!response.ok)
throw new Error(`Error ${response.status}`);
responseArray.push(await response.json());
}
...
} catch (error){
console.log(error);
}
}
添加回答
舉報(bào)