Me enfrento al siguiente problema con Realm y React Native.
Dentro de mi componente, quiero escuchar los cambios del Reino, que funciona. Pero dentro del oyente, mi estado siempre está indefinido; también después de establecer el estado dentro del oyente, el gancho useEffect no se activa. Parece que todo lo que está dentro del oyente no tiene acceso a mis objetos de estado.
Necesito acceder a los estados dentro del oyente para establecer el estado correctamente. ¿Cómo puedo hacer esto?
editar: el estado parece estar siempre desactualizado. Después de la recarga en caliente, el estado es correcto, pero siempre va a la zaga de 1 edición.
const [premium, setPremium] = useState<boolean>(true); const [settings, setSettings] = useState<any>({loggedIn: true, userName: 'XYZ'}); useEffect(() => { console.log('updated settings'); // never gets called }, [settings]); useEffect(() => { const tmp: any = settingsRealm.objects(MyRealm.schema.name)[0]; tmp.addListener(() => { console.log(premium, settings); // both return undefined if (premium) { setSettings(tmp); } // for demonstration purposes setSettings(tmp); }) }, []);Para cualquiera que tenga el mismo problema:
Agregar un useRef que haga referencia al estado y actualizar ambos (!) Al mismo tiempo (estado y referencia) resolverá el problema. Ahora todas las instancias (dentro del oyente) de "premium" deberán cambiarse a "premiumRef.current".
const [premium, _setPremium] = useState<boolean>(true); const [settings, setSettings] = useState<any>({loggedIn: true, userName: 'XYZ'}); const premiumRef = useRef<boolean>(premium); const setPremium = (data) => { premiumRef.current = data; _setPremium(data); } useEffect(() => { const tmp: any = settingsRealm.objects(MyRealm.schema.name)[0]; tmp.addListener(() => { if (premiumRef.current) { setSettings(tmp); } }) }, []); [1]: https://medium.com/geographit/accessing-react-state-in-event-listeners-with-usestate-and-useref-hooks-8cceee73c559