Question

有没有一种方法可以让react-navigation管理所有导航方面，而又让redux管理其余的导航方面，而又不会使它们陷入混乱。

react-navigation不再支持redux，这让我非常难过。

警告：在即将于2018年秋季发布的下一个主要版本的React Navigation中，我们将不再提供有关如何与Redux集成的任何信息，并且它可能会停止工作。

我并不特别在意由redux存储管理导航状态，但是我确实希望在此管理我的显示状态。 react-navigation要求您传递状态，这对于小型应用程序来说很好，但是扩展性不好。

通过在我关心的每个页面上运行react-navigation，我可以与connect一起使用redux。一切正常，直到您开火并采取行动破坏局部react-navigation状态为止。

你们有没有像我上面描述的那样react-navigation与redux一起工作？

Answer 1

这就是我的做法。我发现最简单的方法是在创建路线时在所有屏幕上使用“连接”。我希望这会有所帮助：

const AppNavigator = createStackNavigator(
  {
    Route1: {
      screen: setupReduxContainer(Screen1)
    },
      Route2: {
        screen: setupReduxContainer(Screen2)
      }
  },
  {
    initialRouteName: "Route1"
  }
);

export const NavigationContainer = createAppContainer(AppNavigator);

export function setupReduxContainer(component) {

const Container = component;

  return connect(
    state => ({ ...state })
  )(props => <Container {...props} />);
}


export default () => (
  <Provider store={store}>
    <NavigationContainer />
  </Provider>
);

沿着侧面反应导航使用redux

1 个答案: