Dev*_*son 3 async-await reactjs axios use-effect use-state
我正在尝试在 React 钩子中获取一些数据。这里没什么特别的,只是一些加载文本,然后在我的数据加载后替换。
但是我一直点击我的 catch 块并Failed to fetch data: Cannot read property 'get' of undefined TypeError: Cannot read property 'get' of undefined打印到控制台。
import React, { useState, useEffect } from "react";
import { axios } from "axios";
const DataPanel = () => {
let [isLoading, setLoading] = useState(false);
let [data, setData] = useState();
useEffect(() => {
async function getData() {
let response;
setLoading(true);
try {
response = await axios.get("urltosomewhere");
setData(response);
} catch (e) {
console.log(`Failed to fetch data: ${e.message}`, e);
return;
} finally {
setLoading(false);
}
}
getData();
});
return (
<div>
<div>{isLoading ? <span>Loading...</span> : <span>{data}</span>} </div>
</div>
);
};
export default DataPanel;
Run Code Online (Sandbox Code Playgroud)
你需要import axios from 'axios',不是import { axios } from 'axios'。
这是因为axios模块默认导出axios类。它不是命名导出,因此无法使用您尝试的方法导入。