El código que se proporciona a continuación funciona perfectamente en navegadores de PC, portátiles, pestañas y dispositivos móviles. Este código detecta si el usuario está abriendo otra pestaña u otro documento o si está perdiendo el foco de la ventana actual del navegador. Pero si construimos una aplicación web a partir de este código usando la vista web de Android, entonces esto no funciona en absoluto.
import React,{useEffect} from 'react'; function App() { useEffect(() => { const onBlurCallback = () => onBlur(); window.addEventListener('blur', onBlurCallback); return () => { window.removeEventListener('blur', onBlurCallback); }; }, []); return ( <div className="App"> </div> ); } function onBlur() { alert('hello'); } export default App;Sugiera una solución que funcione también en la vista web de Android.
No necesita usar addEventListner para el desenfoque como ese en React. Puedes intentarlo así:
<input type="text" onBlur={()=> //... your function here} />Enlace recomendado: Documento oficial
Puede usar la función onBlur agregándola como un atributo de <input /> .
function Example() { return ( <input onBlur={(e) => { console.log('Triggered because this input lost focus'); }} placeholder="onBlur is triggered when you click this input and then you click outside of it." /> ) }