错误:使用 react 时出现意外的严格模式保留字

Question

我正在使用 react 在这里编写演示： 堆栈闪电战演示 我知道await和async方法有问题。但我不知道为什么。 如果单独使用aixos.get().会很好，但是如果我将其包装在一个类中并将其与useEffect中的自定义钩子一起使用，它会抛出我

意外的严格模式保留字

Answer 1

在你的axiosManager 中，关键字async必须写在函数之前，而不是包含函数的变量，所以改变

async const fetchMockData = () =>{
const rst = await axios.get('https://jsonplaceholder.typicode.com/todos/1');
return rst;
}

自

const fetchMockData = async () =>{
const rst = await axios.get('https://jsonplaceholder.typicode.com/todos/1');
return rst;
}

Answer 2

所以我找到了你不能直接在useEffect中使用await的原因，因为它不是异步方法。 所以我们可以把它改成这样：

const fetchData = async () => {
const manager = new AxiosManager();
let rst = await manager.fetchMockData();
console.log(rst);
};
// effect_fechData();
useEffect(() => {   
fetchData();
});

接口管理器：

export default class AxiosManager {
async fetchMockData () {
const rst = await axios.get('https://jsonplaceholder.typicode.com/todos/1');
return rst;
}

};