Necesito detectar una actualización de página y redirigir al usuario a otra página si se ha actualizado una página. Estoy probando esta opción pero parece que no es la forma correcta de hacerlo. En primer lugar, porque parece que performance.navigation.type está en desuso y, en segundo lugar, estoy usando múltiples ganchos de efectos aquí, que no estoy seguro de si eso es correcto. ¿Alguna idea para una solución más elegante?
const EligibilityPage = () => { const [hasRouteChanged, sethasRouteChanged] = useState(false); const location = useLocation(); useEffect(() => { sethasRouteChanged(true); }, [location]); useEffect(() => { if (window.performance) { if (window.performance.navigation.type == "reload" || window.performance.navigation.type == 1) { if (!hasRouteChanged) window.location.href = "/personal-details-page"; } } }, []);No hay ningún problema con su flujo de trabajo actual, pero window.performance.navigation.type está en desuso. La propiedad window.performance.navigation está en desuso en la especificación de nivel 2 de tiempo de navegación. Utilice la interfaz PerformanceNavigationTiming en su lugar.
PerformanceNavigationTiming.type
Esta es una tecnología experimental .
Verifique cuidadosamente la tabla de compatibilidad del navegador antes de usar esto en producción.
Comprobar si una página se recarga o actualiza en JavaScript
const pageAccessedByReload = ( (window.performance.navigation && window.performance.navigation.type === 1) || window.performance .getEntriesByType('navigation') .map((nav) => nav.type) .includes('reload') ); alert(pageAccessedByReload);Como solución alternativa, solo puedo sugerir que si está usando redux y luego guarde algún valor en la tienda redux (o lo que sea que use) para indicar el estado después de la recarga y en el primer cambio de ruta actualícelo para indicar que la ruta se cambió no debido a una actualización .