Как я могу получить значение из магазина Redux вне компонента?

Question

Мне нужно использовать значение хранилища вне компонента.

По сути, у меня есть это:

// imports

import HomeScreen from '../screens/HomeScreen/HomeScreen';
import SettingsScreen from '../screens/SettingsScreen/SettingsScreen';

import FRoute from '../screens/HomeScreen/HomeScreen';
import SRoute from '../screens/SettingsScreen/SettingsScreen';

const HomeStack = createStackNavigator({
  PickupHome: HomeScreen,
});

const SettingsStack = createStackNavigator({
  PickupSettings: SettingsScreen,
});

export default createBottomTabNavigator({
  HomeStack,
  SettingsStack,
});

Как вы только что видели, это не компонент.Это файл, который содержит мои маршруты.Он называется MainTabNavigator.С этим мне нужно сделать что-то вроде этого:

import { createStackNavigator, createBottomTabNavigator } from 'react-navigation';

import HomeScreen from '../screens/HomeScreen/HomeScreen';
import SettingsScreen from '../screens/SettingsScreen/SettingsScreen';

import FRoute from '../screens/HomeScreen/HomeScreen';
import SRoute from '../screens/SettingsScreen/SettingsScreen';

const HomeStack = createStackNavigator({
  // HERE I NEED TO USE THE VALUE FROM THE STORE
  PickupHome: valueFromStore ? HomeScreen : FRoute,
});

const SettingsStack = createStackNavigator({
  // HERE I NEED TO USE THE VALUE FROM THE STORE
  PickupSettings: valueFromStore ? SettingsScreen : SRoute,
});

export default createBottomTabNavigator({
  HomeStack,
  SettingsStack,
});

Как видите, я не могу позвонить connect или что-то подобное, где я могу позвонить в магазины и передать ихкак реквизит, как мы обычно это делаем.

Это редуктор, который я сделал:

import createReducer from '../../../redux/createReducer';
import ActionTypes from '../constants/ActionTypes';

const initialState = {
  navigation: {
    index: 0,
    routes: [
      { key: '1', title: 'Title 1' },
      { key: '2', title: 'Title 2' },
    ],
  },
};

const handlers = {
  [ActionTypes.INDEX_ROUTE](state, action) {
    return {
      ...state,
      navigation: {
        ...state.navigation,
        index: action.payload.index,
      },
    };
  },
};

export default createReducer(initialState, handlers);

И действие:

import ActionTypes from '../constants/ActionTypes';

export const indexRouteAction = index => ({
  type: ActionTypes.INDEX_ROUTE,
  payload: {
    index,
  },
});

export default indexRouteAction;

Например: IЯ использую это хранилище в другом компоненте, и я могу получить доступ к его значениям следующим образом:

export default compose(
  connect(
    store => ({
      navigationStore: store.homeScreen.navigation,
    }),
    dispatch => ({
      indexRouteActionHandler: data => {
        dispatch(indexRouteAction(data));
      },
    }),
  ),
)(withNavigation(TopTabView));

Так что я могу получить значения оттуда и все.

Так что же мне еще сделать, чтобы получить значения этого хранилища в моем файле, который я опубликовал первым?

ОБНОВЛЕНИЕ:

Я былчитая об этом: https://redux.js.org/api/store#getState Но я не знаю, как адаптировать это к моему коду, и я не знаю, будет ли это решение работать в моем случае.Есть идеи?

Answer 1

Где-то в вашем коде вы будете создавать магазин, как показано ниже:

const store = createStore( ..reducers);

Экспортируйте этого парня, импортируйте туда, куда вы хотите получить доступ к магазину, а затем

store.getState().item // You can access store data