域监听器中的状态未定义(realm和React Native)

Question

我在使用Realm和React Native时面临以下问题。

在我的组件中，我想要监听Realm的变化，这确实有效。但是在监听器中，我的状态总是未定义的——同样在监听器中设置了状态后，useEffect钩子不会触发。看起来侦听器中的所有内容都不能访问我的状态对象。

为了正确设置状态，我需要访问侦听器内部的状态。我该怎么做呢?

编辑:国家似乎总是过时的。热加载后，状态是正确的，但仍然滞后于1编辑总是。

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);
})
}, []);

Answer 1

对于有同样问题的人:

添加一个useRef引用状态，并同时更新(!)(state和ref)将解决这个问题。现在所有"premium"的实例(在侦听器内)必须改为"premiumRef.current"

https://medium.com/geographit/accessing-react-state-in-event-listeners-with-usestate-and-useref-hooks-8cceee73c559

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