我有一個反應狀態，其中包含一組看起來像這樣的物件 {ID: 7, LicenseNumber: 'Testing123', LicenseCreator: 7, added: true}
為了操作這個物件的各個值，我準備了一個如下所示的函式：
const updateLicenseInfo = (index, licenseInfoKey, licenseInfoVal) => {
const foundLicenseInfo = { ...licenseInfo[index] };
const licenseInfoItems = [...licenseInfo];
foundLicenseInfo[licenseInfoKey] = licenseInfoVal;
licenseInfoItems[index] = foundLicenseInfo;
setLicenseInfo([...licenseInfoItems]);
};
我的問題是當我連續兩次運行這個函式時，我相信鉤子的異步特性只會導致最后一個函式運行。
例如，當我進行 API 呼叫然后嘗試更新 ID 時，添加的欄位 ID 將為空但添加的欄位已更改。這是那個例子：
postData('/api/licenseInfo/createLicenseInfoAndCreateRelationship', {
LicenseNumber,
RequestLineItemID: procurementLine.ID
})
.then((res) => res.json())
.then((r) => {
updateLicenseInfo(licenseIndex, 'ID', r.ID);
updateLicenseInfo(licenseIndex, 'added', true);
})
如何確保此函式運行，然后下一個函式同步運行
uj5u.com熱心網友回復：
如何重構您的初始函式以將物件陣列作為引數，具有結構的東西，{key: "", val: ""}然后在函式中迭代該陣列，將所有值添加到成對的鍵并setState僅呼叫一次，以及所有新更改
const updateLicenseInfo = (index, pairs) => {
const foundLicenseInfo = { ...licenseInfo[index] };
const licenseInfoItems = [...licenseInfo];
pairs.forEach((pair)=>{
foundLicenseInfo[pair.key] = pair.value;
});
licenseInfoItems[index] = foundLicenseInfo;
setLicenseInfo([...licenseInfoItems]);
};
并像這樣呼叫
updateLicenseInfo(licenseIndex, [{key:'ID', value:r.ID},
{key:'added', value:true}]);
轉載請註明出處，本文鏈接：https://www.uj5u.com/caozuo/344623.html
標籤：javascript 反应 异步