Estoy tratando de ejecutar una función solo después de 5 segundos, pero se ejecuta inmediatamente después de renderizar
A continuación se muestra mi código
class App extends React.Component { onInactive = (ms, cb) => { var wait = setTimeout(cb, ms); document.onmousemove = document.mousedown = document.mouseup = document.onkeydown = document.onkeyup = document.focus = function () { clearTimeout(wait); wait = setTimeout(cb, ms); }; }; render() { this.onInactive(5000, alert("Inactive for 5 seconds")); return ( <div className="App"> <h1>Hello CodeSandbox</h1> <h2>Start editing to see some magic happen!</h2> </div> ); } } export default App;Este es mi enlace de codesandbox
En su código, el segundo parámetro no es una función, es una declaración, pero la función setTimeout espera que el primer parámetro sea una función de devolución de llamada. Por favor, compruebe el código de trabajo a continuación para ello.
import React from "react"; /** * Add any other events listeners here */ // const events = ["mousemove", "click", "keypress"]; class App extends React.Component { onInactive = (ms, cb) => { var wait = setTimeout(cb, ms); document.onmousemove = document.mousedown = document.mouseup = document.onkeydown = document.onkeyup = document.focus = function () { clearTimeout(wait); wait = setTimeout(cb, ms); }; }; render() { this.onInactive(5000, () => alert("Inactive for 5 seconds")); return ( <div className="App"> <h1>Hello CodeSandbox</h1> <h2>Start editing to see some magic happen!</h2> </div> ); } } export default App;