使用反应路由器通量返回时如何重新渲染或刷新上一个屏幕答案

【问题标题】：How to re-render or refresh previous screen when going back using react router flux使用反应路由器通量返回时如何重新渲染或刷新上一个屏幕
【发布时间】：2020-12-20 11:37:48
【问题描述】：

在我的 react native 应用程序中，我正在使用 react native 路由器 Flux，在返回上一个屏幕时，我希望上一个屏幕重新渲染或刷新。我正在使用 Action.pop() 回到上一个。如何刷新上一个屏幕？

【问题讨论】：

标签： reactjs react-native react-native-router-flux

【解决方案1】：

您需要在屏幕上的导航对象上监听“焦点”事件，并在事件处理程序中添加获取新数据的逻辑。

function YourScreenComponent({ navigation }) {
  React.useEffect(() => {
    const unsubscribe = navigation.addListener('focus', () => {
      // fetch new data here
    });

    return unsubscribe;
  }, [navigation]);

  return <SomeContent />;
}

【讨论】：

【解决方案2】：

我使用 react routerflux 的 Action.reset('key of the screen') 解决了这个问题

【讨论】：

您只是在创建一个新的屏幕实例，然后从头开始重新完成所有工作。在大多数情况下，您只想触发 fetch 并且屏幕上的所有其他内容仍然有效。