подключить реактив-навигацию напрямую к редуксу?

Question

Можно ли напрямую подключить TabNavigator или StackNavigator к Redux?

Это очень полезно для условного перехода к экрану в зависимости от того, существует ли какое-либо условие в хранилище Redux (т. Е. Если пользователь вошел или вышел).

Пример:

const Tabs = TabNavigator({ screen: userIsSignedInRedux ? SignedInTabNavigator : SignedOutScreen, }, });

, где userIsSignedInRedux - это ключ в моем магазине Redux.

Answer 1

Попробуйте:

import React from 'react';

const TabNavigator = ({ isLoggedIn }) => {
  const RouteConfigs = {
      Screen: isLoggedIn ? SignedInTabNavigator : SignedOutScreen
  };
  const Navigator = createBottomTabNavigator(RouteConfigs);

  return <Navigator />
};

const mapStateToProps = ({ auth }) => ({ isLoggedIn: auth.isLoggedIn });

export default connect(mapStateToProps)(TabNavigator);

Но задайте , чтобы не отображать навигацию до тех пор, пока не будет определено значение isLoggedIn. Если нет, вы увидитекакой-то эффект мерцания (будет отображен SignOutScreen, и через несколько секунд вы увидите, что SignInTabNavigator обнаруживается, если isLoggedIn разрешен в true)

Answer 2

Обычно это возможно, но не рекомендуется из-за потенциальных проблем с производительностью при таком подходе.

React-navigation ранее имела документацию по этой теме, но удалила ее, как не рекомендуется в последней версии.

Вы можете проверить следующее: https://reactnavigation.org/docs/en/redux-integration.html

Вы можете подключить определенный вид (сначала в навигаторе) к redux, а внутри метода componentWillMount перенаправить, если ваш пользователь, например, вошел в систему.

Однако, если у вас есть конкретный случай, который сэкономил бы ваше время, если бы он обрабатывался с помощью приставки, проверьте это решение:

https://github.com/react-navigation/react-navigation-redux-helpers