¿Solo quiero saber por qué mi requestAnimationFrame no actualiza mi componente de reacción repetidamente? solo devolvió el valor de conteo la primera vez, y luego lo ignoró. aquí está el código:
// ----- animation.js import React from "react"; let count = 0; export default function Update() { return <>{UpdateComponents()}</>; } function UpdateComponents() { count++; window.requestAnimationFrame(UpdateComponents); return <p>count: {count}</p>; } // ------ index.js // ReactDOM.render(<Update />, document.getElementById("root"));export default function Update() { return <>{UpdateComponents()}</>; } <Update /> representa lo que devolvió el primer UpdateComponents() , pero el retorno de los otros UpdateComponents() invocados por window.requestAnimationFrame no es utilizado por ningún componente, por lo que requestAnimationFrame funciona, pero no afecta el contenido del dom.
requestAnimationFrame funciona como espera, si agrega un console.log(count) después del lugar donde incrementa el count , verá que el valor cambia.
La razón por la que no aparece en su DOM es que ningún componente está rastreando el valor de count , por lo que nada sabe que debe volver a procesarse. Deberá vincular sus actualizaciones en cambios de estado o accesorios para que el componente muestre el recuento 'en vivo'.
No se vuelve a renderizar porque no activa el reactdom En otro para que se vuelva a renderizar repetidamente Use este fragmento de código
import React,{useState} from "react"; export default function Update() { Let [count, setCount]=useState(0) function UpdateComponents() { var newcount=count + 1; setCount(newCount) window.requestAnimationFrame(UpdateComponents); UpdateComponents() } return <><p>count: {count}</p></> }Esto debería funcionar perfectamente