Empresas
Empleos
  • Sobre nosotros
  • Soluciones
    • Publicación de vacantes
      Publica tu vacante y recibe candidatos calificados en 48h.
    • Evaluación de candidatos
      500+ pruebas técnicas y psicológicas, más anti-fraude.
    • Headhunting
      Búsqueda ejecutiva a la medida de principio a fin.
    • Nómina + EOR
      Dispersión de nómina y EOR en más de 15 países de LATAM.
  • Precios
  • Empleos

0

103
Vistas
Obtenga datos y luego guárdelos en estado en ReactJS

Tengo una aplicación de reacción en la que obtengo datos de la API de coingecko. Pude mostrar todos los datos usando .map y pude filtrar las criptomonedas según lo que el usuario escribe en la barra de búsqueda. Con este:

 function FetchCrypto() { const [coins, setCoins] = useState([]); const [search, setSearch] = useState(''); useEffect(() => { axios .get( 'https://api.coingecko.com/api/v3/coins/markets?vs_currency=usd&order=market_cap_desc&per_page=10&page=1&sparkline=false' ) .then(res => { setCoins(res.data); console.log(res.data); }) .catch(error => console.log(error)); }, []); // this basically just fetches the data and stores it in Coins state const handleChange = e => { setSearch(e.target.value); }; // update search state to filter for coins (based on what user typed into searchbar) const filteredCoins = coins.filter(coin => coin.name.toLowerCase().includes(search.toLowerCase()) ); // this is to filter the array of data, and display "bitcoin" if user types in "bitcoin" instead of displaying the entire database return ( <div className='coin-app'> <div className='coin-search'> <h1 className='coin-text'>Search a currency</h1> <br></br> <form> <input className='coin-input' type='text' onChange={handleChange} placeholder='Search' /> </form> </div> {filteredCoins.map(coin => { return ( <Coin key={coin.id} name={coin.name} price={coin.current_price} symbol={coin.symbol} image={coin.image} priceChange={coin.price_change_percentage_24h} /> ); })} </div> ); } export default FetchCrypto;

Sin embargo, en lugar de mapear toda la base de datos y mostrarla. Quiero darles a los usuarios la posibilidad de elegir algunas entradas (cryptos) y guardarlas para que no tengan que revisar todo para ver lo que les interesa.

Estaba pensando en .push() los datos de filteredCoins en una matriz y luego usar LocalStorage para conservar el estado. No estoy muy seguro de cómo manejar esto.

así es como se ve hasta ahora después de ser mapeado (los botones de actualización y eliminación en la esquina de cada entrada aún no funcionan... pero me gustaría agregar un botón + para darle la funcionalidad de la que acabo de hablar)

práctica de sitios web criptográficos

about 4 years ago · Juan Pablo Isaza
1 Respuestas
Responde la pregunta

0

al presionar agregar hacer localStorage.setItem("nombre",valor) y luego puede acceder a él a través de localStorage.getItem("nombre")

about 4 years ago · Juan Pablo Isaza Denunciar
Responde la pregunta
Encuentra empleos remotos

¡Descubre la nueva forma de encontrar empleo!

Top de empleos
Top categorías de empleo
Empresas
Publicar vacante Precios Comercial
Legal
Términos y condiciones Política de privacidad
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Recomiéndame algunas ofertas
Necesito ayuda