Intento obtener datos de una API y mostrarlos en DOM y estoy usando los datos obtenidos como un accesorio para mostrar, pero cuando intento pasar {input.bitcoin} como un accesorio, React muestra $[object Object] así que lo intenté {input.bitcoin.usd} que termina devolviendo Uncaught TypeError: Cannot read properties of undefined (reading 'usd')
Aquí está mi código:
li y solo hay {coinPrice} prop adentro y nada más. import React from "react"; import { useState, useEffect } from "react"; import CoinListView from "./CoinListView"; const Main = () => { const [input, setInput] = useState({}); const options = { method: "GET", headers: { "X-RapidAPI-Host": "coingecko.p.rapidapi.com", "X-RapidAPI-Key": "API-KEY", }, }; const fetchData = async () => { try { const response = await fetch( "https://coingecko.p.rapidapi.com/simple/price?ids=bitcoin,ethereum,litecoin,tether&vs_currencies=usd", options ); const data = await response.json(); const newData = data; console.log(newData); return setInput(newData); } catch (err) { return console.error(err); } }; useEffect(() => { fetchData(); }, []); return ( <div> <div> <div className="prices"> <CoinListView coinPrice={input.bitcoin} /> </div> </div> </div> <script src="https://cdnjs.cloudflare.com/ajax/libs/react/16.6.3/umd/react.production.min.js"></script> <script src="https://cdnjs.cloudflare.com/ajax/libs/react-dom/16.6.3/umd/react-dom.production.min.js"></script>