deseo saber como detectar que un usuario haya presionado F5 o actualizar en su navegador mientras está en cierta dirección de la página que estoy desarrollando con React, esto con el fin de mostrar una ventana de confirmación y ejecutar algunas funciones dependiendo de la respuesta del usuario (confirmar actualizar página o cancelar la actualización de la página).
Encontré este código y probé ponerlo dentro de mi functional component con React:
import React from 'react';
const MyComponent = () => {
window.onbeforeunload = function() {
const isOK = confirm('Message');
if (confirm('Successful Message')) {
window.location.reload();
}
return '¿Desea recargar la página web?';
};
return <div>Hola</div>
}
export default MyComponent;
La estructura del componente es solo de ejemplo de donde estoy poniendo la función con window.onbeforeunload
.
Pero nunca se ejecuta cuando actualizo la página con el navegador.
Edito: he probado la función con solo:
window.onbeforeunload = function() {
return '¿Desea recargar la página web?';
};
Esto funciona, ¿cómo puedo personalizar ese mensaje y ejecutar acciones dependiendo cual botón presione?