Как изменить стиль заголовка Навигатора ящиков на основе Навигатора вкладок

#react-native #react-hooks #navigation-drawer #react-navigation-bottom-tab #react-navigation-v6

Вопрос:

Я решил эту конкретную проблему, разделив в разных файлах компоненты навигации, таким образом, компонент больше не повторяется

Прежде всего: я использую React Native. У меня есть навигатор вкладок, вложенный в навигатор рисования

я пытаюсь изменить цвет заголовка ящика в зависимости от конкретного экрана в Навигаторе верхней вкладки материала.

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

PD: Приложение имеет верхний заголовок из ящика и нижнюю вкладку из навигатора. Мне нужно, чтобы они оба меняли цвет, когда экран X находится в фокусе. Для этого на нижней вкладке я использовал маршрут.имя, но я не могу получить доступ к этому свойству из родительского навигатора.

 .... screenOptions={({route}) =gt; ({  tabBarStyle: {  backgroundColor:  route.name === '[targetScreen]' ? '#6600A1' : theme.PRIMARY_COLOR,  }, ...  

Ответ №1:

Существуют различные варианты предоставления состояния в обоих направлениях, Redux, Отдача, Поставщик контекста. Если вы еще не используете один из них, я думаю, что поставщик контекста самый простой. По сути, это контейнер вокруг вашего внешнего навигатора, а внутри вы можете получить доступ и изменить состояние.