react-navigation

After a long research MetroJS bundler default not compile typescript .ts and .tsx extension files. We need tell MetroJS bundler to compile .ts and .tsx files i solved this error by edit metro.config.js file in root project folder by following. Edited on September 2022 Added cjx and json extensions to below snippet All extensions listed … Read more

Warning: react-navigation changes a lot, the way to do title align, already changed for like 2-3 times from my first answer of it. If my answer doesn’t work for you, please see other answers. Modified 2021/08/31: In year of 2020, headerLayoutPreset was also deprecated. The new way is via defaultNavigationOptions: (@ThatFrenchComputerGuy’s answer helped me) const … Read more

You can pass a callback function as parameter when you call navigate like this: const DEMO_TOKEN = await AsyncStorage.getItem(‘id_token’); if (DEMO_TOKEN === null) { this.props.navigation.navigate(‘Login’, { onGoBack: () => this.refresh(), }); return -3; } else { this.doSomething(); } And define your callback function: refresh() { this.doSomething(); } Then in the login/registration view, before goBack, you … Read more

In React Navigation 5, this becomes much easier by passing in the screen as the second parameter: navigation.navigate(‘Nested Navigator 2’, { screen: ‘screen D’ }); You can also include additional levels if you have deeply nested screens: navigation.navigate(‘Nested Navigator 2’, { screen: ‘Nested Navigator 3’, params: { screen: ‘screen E’ } });