反应导航5中的willFocus事件

Question

我需要在焦点事件之前获取数据。我看到了willFocus事件在反应导航4中存在，但似乎在反应导航5中删除了该事件。

componentDidMount无法做到这一点，因为我希望在每次用户导航到屏幕时，在屏幕进入焦点之前就尽快获取数据，。

Answer 1

你可以这样做：

  /**
   * Your redux action should set loading-state to false after
   * fetch-operation is done...
   */
  reduxActionDoingFetch();

  useEffect(() => {
    if (reduxActionDoingFetch_Loading === false) {
      Navigation.navigate('YourTargetScreen');
    }
  }, [reduxActionDoingFetch_Loading]);

Answer 2

不能在componentDidMount之前获取数据。这是在呈现新屏幕时发生的第一件事。

对于每次屏幕聚焦时获取数据，您需要使用迁移指南中提到的focus事件：https://reactnavigation.org/docs/upgrading-from-4.x/#navigation-events。

与以前的focus事件等效的willFocus事件。在动画完成之前，只要屏幕聚焦，它就会启动。我不知道你说的太晚了是什么意思。

另外，对于数据获取，有一个特殊的钩子：useFocusEffect

https://reactnavigation.org/docs/use-focus-effect/

Answer 3

React.useEffect(() => {
    const unsubscribe = navigation.addListener('focus', () => {
      // do something
    });

    return unsubscribe;
  }, [navigation]);