[英]Getting Error regarding :Cannot read property 'length' of undefined
我不知道为什么它的给定长度undefiined
而另一个是setDailyData
不是 function
const Charts = () => {
const { setDailyData, dailyData } = useState([]);
useEffect(() => {
const fetchAPI = async () => {
setDailyData(await fetchDailyData());
};
console.log(dailyData);
fetchAPI();
}, []);
在这里,我试图从dailyData
中获取数据并使用三元操作来检查是否有任何数据,然后显示图表
如果没有,(通过检查数组的长度)它应该显示null
即使使它成为dailyData[0]
,我也给出错误无法读取'0'属性。
const lineChart =
( dailyData.length ?(
<Line
data={{
labels: dailyData.map(({ date }) => date),
datasets: [
{
data: dailyData.map(({ confirmed }) => confirmed),
label: "Infected",
borderColor: "#3333ff",
fill: true,
},
{
data: dailyData.map(({ deaths }) => deaths),
label: "Deaths",
borderColor: "#3333ff",
backgroundColor: "rgba(255,0,0,0.5)",
fill: true,
},
],
}}
/>
):null
)
API 代码用于获取图表数据
export const fetchDailyData = async ()=>{
try {
const {data} = await axios.get(`${url}/daily`);
const modifiedData = data.map((dailyData) =>({
confirmed:dailyData.confirmed.total,
deaths:dailyData.deaths.total,
date:dailyData.reportDate
}));
console.log(data);
return modifiedData;
} catch (error) {
return error;
}
}
useState 返回一个数组,而不是 object
从你的代码
const Charts = () => {
// const { setDailyData, dailyData } = useState([]);
const [dailyData, setDailyData] = useState([]) // <-- change to this
useEffect(() => {
const fetchAPI = async () => {
setDailyData(await fetchDailyData());
};
console.log(dailyData);
fetchAPI();
}, []);
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.