Estoy tratando de hacer que un visualizador de clasificación reaccione y me preguntaba cuál sería la mejor manera de implementar la animación para cada clasificación, ya que soy bastante nuevo en eso.

 import './App.css'; import React, { useEffect, useState } from "react" function App() { const[arr, setArr] = useState([]) const[size, setSize] = useState(20) useEffect(() => { const randomArray = Array.from({ length: size }, () => Math.floor(Math.random() * (300 - 1) + 1) ) setArr(randomArray) }, [size]) console.log(arr) return ( <div className='container'> <div className='bars'> {arr.map((bar, idx) => { return <div key={idx} className="bar" style={{ height: `${bar}px`, backgroundColor: "red" }}></div> })} </div> </div> ); } export default App;