Tengo un proyecto Next.js / React.js en el que estoy trabajando y estoy tratando de redirigir a una página determinada cuando se hace clic en el botón Atrás del navegador. Mi enfoque es el siguiente
useEffect(() => { Router?.beforePopState(({ as }) => { if (as !== router.asPath) { handleRouteChange({ toHref: getRoutingPath('HOME') }, Router.push); } return true; }); return () => { Router?.beforePopState(() => true); }; }, [dispatch, router]);Y este código funciona. Cuando hago clic en el botón Atrás, me lleva a la página de inicio según lo previsto.
Pero el problema es que cuando hago clic en el botón Atrás, me lleva a la página anterior por un segundo y luego me redirige a la página de inicio. ¿Cómo puedo evitar ir a la página anterior?
Puede devolver false desde la devolución de llamada beforePopState para deshabilitar Next.js que maneja el enrutamiento automáticamente y manejarlo usted mismo.
De la documentación de router.beforePopState :
Si
cbdevuelvefalse, el enrutador Next.js no manejarápopstatey usted será responsable de manejarlo en ese caso. Consulte Deshabilitar el enrutamiento del sistema de archivos .
useEffect(() => { router.beforePopState(({ as }) => { if (as !== router.asPath) { handleRouteChange({ toHref: getRoutingPath('HOME') }, Router.push); return false; } return true; }); return () => { router.beforePopState(() => true); }; }, [router]);