javascript - 在 React 中访问嵌套的 JSON 对象
问题描述
数据集:https ://disease.sh/v3/covid-19/historical/usa?lastdays=all
我是 React 的新手,正在尝试使用 COVID-19 跟踪器让我的脚湿透,所以请耐心等待...我正在尝试从上述数据集中访问时间轴 > 案例,但似乎无法使其工作。我已经尝试过let date in data.timeline.cases
,但这也不起作用。也许我在寻找错误的地方 - 寻找一些指导。谢谢!
const buildChartData = (data, casesType) => {
let chartData = [];
let lastDataPoint;
for (let date in data.cases) {
if (lastDataPoint) {
let newDataPoint = {
x: date,
y: data[casesType][date] - lastDataPoint,
}
chartData.push(newDataPoint);
}
lastDataPoint = data[casesType][date];
}
return chartData;
};
function LineGraph({ casesType = 'cases' }) {
const [data, setData] = useState({});
useEffect(() => {
const fetchData = async() => {
await fetch('https://disease.sh/v3/covid-19/historical/usa?lastdays=120')
.then((response) => {
return response.json()
})
.then(data => {
let chartData = buildChartData(data, casesType);
setData(chartData);
});
};
fetchData();
}, [casesType]);
解决方案
好的,正如您所说,您尝试过,let date in data.timeline.cases
但您也需要更改代码的另一部分。
不是data[casesType]
但data.timeline[casesType]
for (let date in data.timeline.cases) {
if (lastDataPoint) {
let newDataPoint = {
x: date,
y: data.timeline[casesType][date] - lastDataPoint,
}
chartData.push(newDataPoint);
}
lastDataPoint = data.timeline[casesType][date];
}
推荐阅读
- python - 使用 pytorch 数据加载器转储图像数据并加载
- java - 如何总结一对多关系JPA中每个项目的成本?
- sql - 将 SQL Server 中的天数/小时数从标头转为行级别
- docker - 如何使用 Postman 访问在 Docker 中运行的 ASP Core Web Api
- java - 随机 com.jcraft.jsch.SftpException - 没有带有错误代码 2 的此类文件或目录
- python - 像素 RGB 值标识符 - 类型错误:参数必须是长度为 2 的序列
- java - ObjectOutput/ObjectInput 流如何工作?
- javascript - Javascript字符串替换没有替换我的参数
- docker - 在容器上调试 Go 进程不会监听映射的端口
- r - 如何在R中通过递归扩展项目