Hola, espero que tengas un gran día. Acabo de ingresar a React y estaba tratando de convertir mis códigos antiguos a React , pero la cosa es que mis códigos antiguos eran Jquery y tengo dificultades para convertirlos a Vanilla Javascript .

Aquí está mi antiguo código:

 function progress() { var windowScrollTop = $(window).scrollTop(); var docHeight = $(document).height(); var windowHeight = $(window).height(); var progress = (windowScrollTop / (docHeight - windowHeight)) * 100; var bgColor = progress > 99 ? "#fff" : "#fff"; var textColor = progress > 99 ? "#fff" : "#333"; $("h1").text(Math.round(progress) + "%").css({ color: textColor }); $(".fill").height(progress + "%").css({ backgroundColor: bgColor }); } progress();

Lo que he hecho hasta ahora:

 let progress = () => { let windowScrollTop = window.onscroll; let docHeight = document.offsetHeight; let windowHeight = window.offsetHeight; let progress = (windowScrollTop / (docHeight - windowHeight)) * 100; let bgColor = progress > 99 ? "#fff" : "#fff"; let txtColor = progress > 99 ? "#fff" : "#333"; document.querySelector("h1").innerHTML = Math.round(progress) + "%"; document.querySelector("h1").style.color = bgColor; document.querySelector(".fill").innerHTML = Math.round(progress) + "%"; document.querySelector(".fill").style.color = txtColor; } progress();

Por último , Math.round() muestra NaN

Lo siento mucho por todos los problemas, espero que me puedan ayudar con mi problema. Gracias