如何在单次使用中使用焦点和模糊监听器效果反应原生

问题描述

正如你在 useEffect 中所知道的，如果我们将任何侦听器分配给 unsubscribe const，我们会在最后返回 unsubscribe，如下所示

我们正在使用

useEffect(() => {
    const unsubscribe = navigation.addListener('focus',() => {
        // code
    })
    return unsubscribe;

},[navigation]);

如我所愿

useEffect(() => {
    const unsubscribe = navigation.addListener('focus',() => {
        // code
    })
    const unsubscribe2 = navigation.addListener('blur',() => {
        // code
    })

    // need to return both listeners

},[navigation]);

解决方法

你可以cleanup这样

useEffect(() => {

    navigation.addListener('focus',handler)
    navigation.addListener('blur',handler)
    return () => {
                navigation.removeListener('focus',handler)
                navigation.removeListener('blur',handler)
            }

},[navigation])

这里的官方例子https://reactjs.org/docs/hooks-effect.html#effects-with-cleanup

,

我没有对此进行测试，但您可能可以执行以下操作：

useEffect(() => {
    const unsubscribe = navigation.addListener('focus',() => {
        // code
    });
    const unsubscribe2 = navigation.addListener('blur',() => {
        // code
    });
    return () => {
     // executed when unmount
     unsubscribe();
     unsubscribe2();
    }
},[navigation]);