Business
Jobs
  • About Us
  • Solutions
    • Job Postings
      Post your job and receive qualified candidates in 48h.
    • Candidate Assessments
      500+ technical and psychological tests, plus anti-fraud.
    • Headhunting
      Tailor-made executive search from start to finish.
    • Payroll + EOR
      Payroll dispersal and EOR across 15+ LATAM countries.
  • Pricing
  • Jobs

0

223
Views
¿Cómo mantengo la posición de desplazamiento cuando regreso a una página usando la carga diferida?

En realidad, la pregunta es muy clara, como se ve en el título. La parte que quiero agregar es esta, al igual que en Twitter, cuando bajo la página y luego ingreso un perfil de usuario o detalle de publicación y vuelvo a la página anterior presionando el botón Atrás en el navegador, la página se abre donde la dejé. fuera, a pesar de ser perezoso. ¿Cómo puedo lograr esto con Django. No sé si importa, pero Vue se usa como cdn en mi proyecto.

Me gustaría hablar de un ejemplo sobre el tema. En los navegadores Safari y Chrome en una computadora con macOS, cuando se presiona el botón Atrás en el navegador, se lleva a cabo exactamente el evento que quiero. Vuelve como si la página anterior estuviera en caché, pero en equipos con Windows o Linux, cuando se presiona el botón Atrás del navegador, se vuelve a la página anterior solicitándola nuevamente.

about 4 years ago · Juan Pablo Isaza
1 answers
Answer question

0

Si está utilizando vistas para representar toda su página, no puedo ver ninguna forma sencilla que haga que el navegador se desplace en el botón Atrás.

En el caso de las plantillas HTML/CSS/JavaScript, tiene dos opciones: confiar completamente en el navegador para administrar el desplazamiento por usted (funcionará cuando el navegador almacene en caché la página).

O puede agregar un script simple que almacene rutas anteriores y actuales en el almacenamiento local y verifique el desplazamiento en la carga de la página:

 const json = localStorage.getItem("routes"); const currentPath = window.location.pathname; let newPrevious = null; if(json) { const routes = JSON.parse(json); const isPrevious = routes.previous != null && routes.previous.path === currentPath; if(isPrevious){ const { x, y } = routes.previous; window.scrollTo(x,y); } //Our new previous route is the old current newPrevious = routes.current; } //Now we update the current route. const newRoutes = { current: { x: 0, y: 0, path: currentPath }, previous: newPrevious } localStorage.setItem("routes", JSON.stringify(newRoutes));

Incluya el script anterior al cargar cada página. Ahora agregamos un oyente antes de descargar donde agregamos la última posición de desplazamiento.

 const x = window.pageXOffset ?? document.documentElement.scrollLeft ?? document.body.scrollLeft ?? 0; const y = window.pageYOffset ?? document.documentElement.scrollTop ?? document.body.scrollTop ?? 0; let routes = JSON.parse(localStorage.getItem("routes")); routes = { ...routes, current: { ...routes.current, x, y } }; localStorage.setItem("routes", JSON.stringify(routes));

Solo tenga en cuenta que esto forzará el desplazamiento incluso cuando tenga un enlace en su página que redirija a la anterior.

Adición : en caso de que esté pensando en usar una biblioteca frontend como Vue con el enrutador Vue, puede olvidarse de administrar esto manualmente y simplemente usar <router-link> para su redirección en su sitio web y el desplazamiento se administrará automáticamente. Puede verificar esta función aquí en los documentos . Creo que ese es el caso de Twitter, puedes ver aquí que están usando React native for web .

about 4 years ago · Juan Pablo Isaza Report
Answer question
Find remote jobs

Discover the new way to find a job!

Top jobs
Top job categories
Business
Post vacancy Pricing Sales
Legal
Terms and conditions Privacy policy
© 2026 PeakU Inc. All Rights Reserved.
Andres GPT
Show me some job opportunities
There's an error!