Как установить маршрут экрана по умолчанию в React Tab Navigation в React Native

Я хочу, чтобы панель инструментов была активной вкладкой на нижней вкладке React Native. Навигация всякий раз, когда загружается панель мониторинга, но всякий раз, когда я перехожу на панель, она перемещается на экран входящих сообщений, который является первым элементом моей реакции навигации по нижней вкладке. Есть ли способ создать экран по умолчанию, когда используются нижние вкладки экрана?

Код, который я использую для нижней навигации:

 dashboard: {
        screen: createBottomTabNavigator({
            inbox: {
                screen: Chat,
                navigationOptions: ({ navigation }) => ({
                    title: 'Inbox',
                }),
            },
            favourite: {
                screen: Favourite,
                navigationOptions: ({ navigation }) => ({
                    title: 'Favourite',
                }),
            },
            dashboard: {
                screen: Dashboard,
                navigationOptions: ({ navigation }) => ({
                    title: 'Home',
                    initialRouteName: 'dashboard'
                }),
            },
            setting: {
                screen: SettingScreen,
                navigationOptions: ({ navigation }) => ({
                    title: 'Setting',
                }),
            },
            survey: {
                screen: NutritionistSurvey,
                navigationOptions: ({ navigation }) => ({
                    title: 'Survey',
                }),
            },
        }),
        navigationOptions: ({ navigation }) => ({
            title: 'Dashboard',

        }),


    },

Несмотря на то, что навигация работает совершенно нормально, мне просто нужен способ загружать экран панели мониторинга всякий раз, когда пользователь переходит на панель мониторинга.


react-native react-navigation native react-navigation-stack
person theCoder    schedule 08.04.2019    source источник

Ответы (2)


arrow_upward
15
arrow_downward

Вы можете добавить initialRouteName в createBottomTabNavigator, я решу вашу проблему

 const MyApp = createBottomTabNavigator(
      {
        Inbox: {
          screen: Chat,
          navigationOptions: ({ navigation }) => ({
            title: "Inbox"
          })
        },
        Favourite: {
          screen: Favourite,
          navigationOptions: ({ navigation }) => ({
            title: "Favourite"
          })
        },
        Dashboard: {
          screen: Dashboard,
          navigationOptions: ({ navigation }) => ({
            title: "Home"
          })
        }
      },
      {
        initialRouteName: "Dashboard"
      }
    );
person Vishal Dhanotiya    schedule 08.04.2019
comment
Это решило мою проблему Спасибо - person theCoder; 08.04.2019

arrow_upward
0
arrow_downward

У вас есть 2 экрана с названием «Панель инструментов»: bottomTabNavigator и экран Dashboard, поэтому, когда вы попытаетесь перейти на панель управления, response-navigation перейдет к первой вкладке вашего bottomTabNavigator.

Переименуйте bottomTabNavigator, и он должен работать:

 dashboardTabs: {
        screen: createBottomTabNavigator({
            inbox: {
                screen: Chat,
                navigationOptions: ({ navigation }) => ({
                    title: 'Inbox',
                }),
            },
            favourite: {
                screen: Favourite,
                navigationOptions: ({ navigation }) => ({
                    title: 'Favourite',
                }),
            },
            dashboard: {
                screen: Dashboard,
                navigationOptions: ({ navigation }) => ({
                    title: 'Home',
                    initialRouteName: 'dashboard'
                }),
            },
            setting: {
                screen: SettingScreen,
                navigationOptions: ({ navigation }) => ({
                    title: 'Setting',
                }),
            },
            survey: {
                screen: NutritionistSurvey,
                navigationOptions: ({ navigation }) => ({
                    title: 'Survey',
                }),
            },
        }),
        navigationOptions: ({ navigation }) => ({
            title: 'Dashboard',
        }),
    },
person sanjar    schedule 08.04.2019