React Native CLI项目:如何在使用react导航时修复热重新加载

Question

我在一个React Native CLI项目中使用react-navigation，这个breaks是热重新加载的。

Answer 1

为了解决这个问题，我发现我需要一个基于类的根组件，因为热重载不支持功能根组件。我通过将导航组件包装在一个基于类的组件中实现了这一点：

class NavigationWrapper extends Component {
  render() {
    return (
      <NavigationContainer>
        <Stack.Navigator initialRouteName="Home">
          <Stack.Screen name="Home" component={Home} />
          <Stack.Screen name="Menu" component={Menu} />
        </Stack.Navigator>
      </NavigationContainer>
    );
  }
}

const App: () => React$Node = () => {
  return <NavigationWrapper />;
};