Cześć. Chciałem napisać aplikację, która będzie analizować pewne dane pobierane z API. Przykładowy zestaw danych wygląda jak poniżej (niestety nie mogę udostępnić danych):
dane:
aaa: 2.355
bbb: 2.534
ccc: 2.685
data: "{data przeprowadzenia pomiaru}"
info: "{informacje dotyczące pomiaru}"
Dane do state wczytałem za pomocą kodu:
componentDidMount(){
fetch("API")
.then(res => res.json())
.then(jsonData => {
this.setState({
dane: Object.entries(jsonData.dane).map(([key, value]) => ({key, value})),
data: jsonData.data,
info: jsonData.info
})
})
}
Co pozwoliło mi na uzyskanie
0: {key: "aaa", value: 2.355}
1: {key: "bbb", value: 2.534}
2: {key: "ccc", value: 2.685}
I tutaj pojawia się moje pytanie. W jaki sposób mam te dane przekazać do komponentu, który wyświetli mi tablicę i na tej podstawie narysuje wykres? Jeśli chciałbym wypisać w konsoli wartość liczbową dla np elementu 0 logiczne wydaje się
console.log(this.state.dane[0].value)
ale nie działa. Tak jak wszystkie inne możliwości, które próbowałem.
Udało mi się wypisać tabelę z danymi kiedy state i render wyglądają tak:
this.setState({
dane: Object.entries(jsonData.dane)
}) //bo tutaj wczytuję samą tablicę tablic [["aaa", 2.355], ["bbb", 2.534], ["ccc", 2.685]]
render(){
let table = []
for (let [key, value] of this.state.dane) {
table.push(<li>{key}: {value}</li>)
}
return(
<div>
{table}
</div>
)
}
Potrzebuję jednak żeby przekazać te dane do komponentu. Pewnie rozwiązanie jest banalnie proste i złapię się za głowę że na to nie wpadłem. Bardzo proszę o pomoc.