Quiero verificar si visito la página la primera vez que se ejecuta la función; de lo contrario, no se ejecuta
p.ej:
la primera vez que el usuario abre el sitio página de INICIO muestra que la condición se debe ejecutar después de que el usuario visite/acerca de la página la página de información también se ejecuta la condición por primera vez después de que este usuario vuelva a la página de inicio esta vez, ¿cómo puedo lograr esto en next.js?
import useScrollPosition from "/hooks/useScrollPosition";
const scrollPosition = useScrollPosition(); const [isShowComponents, setIsShowComponents] = useState(false); useEffect(() => { if (scrollPosition >= 100) { setIsShowComponents(true); } }, [scrollPosition]); {isShowComponents ? ( <> <WorkWithUs /> <Team /> <FAQS /> </> ) : <BaseSkeleton />}Esta condición solo se ejecuta cuando el usuario accede por primera vez a la página.
No lo probé por mi cuenta, pero puede intentar algo como esto, guarde las rutas visitadas en localStorage o en cookies en cada Componente
Componente de inicio
import {useLocation} from "react-router-dom" import {useState,useEffect} from "react" const scrollPosition = useScrollPosition(); const [isShowComponents, setIsShowComponents] = useState(false); const Home = ()=>{ const location =useLocation() const scrollPosition = useScrollPosition(); const [path, setPath] = useLocalStorage("home",""); useEffect(()=>{ console.log(localStorage.getItem("home")) if(!localStorage.getItem("home")){ localStorage.setItem("home",location.pathname) }else{ setIsShowComponents(true); } },[]) useEffect(() => { if (scrollPosition >= 100 && !localStorage.getItem("home")) { setPath(localStorage.getItem("home")) } }, [scrollPosition]); return <h1>{path}</h1> }Componente de aplicación
const App = () => { return ( <> <Router> <Routes> <Route exact path="/" element={<Home/>}/> <Route exact path="/about" element={<About/>}/> <Route exact path="/work" element={<Work/>}/> <Route exact path="/setting" element={<Setting/>}/> </Routes> </Router> </> ); };Esto será más bueno si hacemos esta funcionalidad en customHook