Menu
I want to load dashboard to be active tab in react Native bottom tab. Navigation whenever dashboard is loaded but whenever I move to dashboard it moves to inbox screen which is the first element in my react Bottom Tab Navigation. Is there any way to create a default screen whenever screen bottom tabs is used?
The code I am using for bottom navigation is
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',
}),
},
Even though the navigation works completely fine I just need a way to load dashboard screen whenever the user navigates to Dashboard.
375
Add icons to the tab bar To add icons to each tab, first import the Icon component from react-native-vector-icons library inside the navigation/TabNavigator/index. js file. For this example, let's use AntDesign based icons. // after other import statements import Icon from 'react-native-vector-icons/AntDesign';
initialRouteName - Sets the default screen of the stack.
For those facing this issue in 2022, v6.x of React Navigation, the correct way is to specify the initalRouteName prop in the Navigator component. Link to docs
170
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
