Доступ к избыточному состоянию в tabnavigator (реакция-навигация) - PullRequest
Новая
       13

Доступ к избыточному состоянию в tabnavigator (реакция-навигация)

1 голос
/ 05 марта 2020

Я использую избыточность для хранения некоторых значений. Одним из этих значений является логическое значение с именем «seen». Он обновляется до «false» всякий раз, когда приходит новое сообщение (через веб-сокеты), и когда открывается экран сообщений, он снова обновляется до «true».

У меня также есть tabnavigator. В этом tabnavigator у меня есть 4 кнопки (иконки): Домой, Пользователи, Сообщения и Настройки.

Всякий раз, когда значение «seen» равно «false», я хочу показать дополнительный значок в tabnavigator, чтобы показать пользователи у них есть новые сообщения. Так что я хочу иметь доступ к хранилищу приставок в tabnavigator.

Мой код tabnavigator выглядит следующим образом: 

const TabsNavigator = createMaterialTopTabNavigator(
    {
        Home: {
            screen: Home,
            navigationOptions: {
                tabBarIcon: () => (
                    <Icon library="far" icon="home" color="black" size={25} />
                )
            }
        },
        Users: {
            screen: Users,
            navigationOptions: {
                tabBarIcon: () => (
                    <Icon library="far" icon="users" color="black" size={25} />
                )
            }
        },
        Messages: {
            screen: Messages,
            navigationOptions: {
                tabBarIcon: () => {
                    return (
                    <View>
                        // HERE I WANT TO HAVE ACCESS TO THE REDUX STORE (SEEN)
                        // I WANT TO SHOW AN ICON WHEN SEEN = FALSE
                        {seen === false &&
                            <Icon library="far" icon="exclamation" color="black" size={25} />
                        }
                        <Icon library="far" icon="comment" color="black" size={25} />
                    </View>
                )}
            }
        },
        Settings: {
            screen: Settings,
            navigationOptions: {
                tabBarIcon: () => (
                    <Icon library="far" icon="cog" color="black" size={25} />
                )
            }
        }
    },
    {
        initialRouteName: 'Home',
        tabBarPosition: 'bottom',
        tabBarOptions: {
            showIcon: true
        }
    }
)

Как я могу получить доступ к значению "seen" (в прижиме магазин) в табнавигаторе? Добавление useSelector(state => state.messages.seen) в tabnavigator не работает, я получаю сообщение об ошибке, в котором говорится, что "ловушки могут быть вызваны только из тела функционального компонента".

1 Ответ

1 голос
/ 05 марта 2020

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

Например, 

const store = createStore(
  persistedAppReducer, // disregard the actual config
  undefined,
  applyMiddleware(NavMiddleware, LoggerMiddleware, EpicMiddleware)
);

export default store;

Затем вы можете импортируйте это store и получите состояние следующим образом: store.getState()

...