调用 await fetch 从我的函数中退出，并没有完成其余的代码

Question

我有一个函数可以加载 JSON 文件，其中包含如下所示的信息：

async function loadJsonFile() {
    try{
        const jsonResponse = await fetch("/config/jsonfile.json", {
            headers: {
                "Content-Type": "application/json",
                Accept: "application/json",
            },
         });

         return await jsonResponse.json()
     } catch(e){
         console.log(e.message);
         return e.message;
     }
}

但是，在调试我的代码时 loadJsonFile 被介入。然后用 await fetch 命中代码行，然后退出函数，不完成任何其他操作。我想知道是否有人能够提供帮助？

export const getInit = () => {
    return async (dispatch) => {
        const json = await loadJsonFile();
        // more code that needs to be completed below...
    }
}

更新 1

我注意到我的 catch 语句中有错字。我已经解决了这个问题，但仍然遇到同样的问题。

Answer 1

这可能是因为你的 catch 块，你得到 err 作为错误变量，但你使用了 console.log(e.message); return e.message; 并且因为 e 是 undefined 它导致未处理的错误准确的。您可以这样更改它：

...
catch(err){
   console.log(err.message);
   return err.message;
 }
...

Answer 2

您如何看待使用不同的语法，例如：

function loadJsonFile() {
    return fetch('/config/jsonfile.json', {
        headers: {
            'Content-Type': 'application/json',
            Accept: 'application/json',
        },
    })
        .then(response => response.json())
        .catch(error => {
            console.log(error.message);
            return error.message;
        });
}

Answer 3

我认为你应该尝试删除第二个 await。

调用 await fetch 从我的函数中退出，并没有完成其余的代码

Calling await fetch steps out of my function and does not complete the rest of the code

javascript

async-await

react-redux