與await語句執行順序不一致
P粉691461301
P粉691461301 2023-09-12 13:42:02
0
1
652

我在程式碼的執行序列中遇到了意外行為。這是程式碼片段:

console.log("1");
await reloadScenarios();
console.log("2");

const reloadScenarios = () => {
    if (token) {
        getScenario()
            .then(({ scenarios }) => {
                console.log("3");

                const transformedScenarios = scenarios.map(option => ({
                    scenario: option.name,
                    description: option.categories.name,
                    value: option._id
                }));

                setOptions(transformedScenarios);
                // setSelectedOption(transformedScenarios[0]?.value || null);
            })
            .catch((error) => {
                console.error('Failed to fetch scenario options:', error);
            });
    }
};

我預期執行順序是1,3,2。但是,當我運行程式碼時,實際順序是1,2,3。有人可以解釋為什麼會發生這種情況嗎?

此外,我注意到當我修改 reloadScenarios 函數以在 getScenario() 之前包含 return 語句時,執行順序更改為 1, 3, 2 - 這是所需的順序。我真的需要 return 語句,還是有其他解釋來實現所需的序列?

P粉691461301
P粉691461301

全部回覆(1)
P粉019353247

您的問題是您正在使用await 來呼叫一個非非同步且不傳回Promise 的函數。由於函數不傳回 Promise,因此繼續執行。

如果您希望顯示的序列為“1,3 2”,那麼您必須使用async標記您的函數

const reloadScenarios = async () => {
    // Your body function
};

這樣,當您標記await reloadScenarios時,您正在等待承諾解決(或拒絕)。

有關更多詳細信息,請參閱文件:https ://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Operators/await

#編輯 抱歉,我忘了,還有一個問題:你還必須在函數中回傳承諾

熱門教學
更多>
最新下載
更多>
網站特效
網站源碼
網站素材
前端模板