How to disable back button after splash screen in React Native

how to disable back button in react native
disable back button react native ios
disable header back button react native
react-native back button handler
react native webview back button
react-navigation stacknavigator back button
exit app on back button react native
back in react native

after I finished loading the splash screen and going to the main page, I pressed it back again to go back to the splash screen ..

and the question is how to overcome this, so that after entering the main page I can't go back to the splash screen either from the button or back button on the phone keyboard,

Thanks in advance ..

I suppose you're using a stack navigator. Change it to a switch navigator and you'll not navigate to the previous screen when pressing back.

Here is a basic working example :

https://snack.expo.io/@sanjar/so-53764740

ps : In this example, I'm using react-navigation 2 (the latest version is 3).

Preventing hardware back button android for React Native, How do I disable the Back button in react native? How to Hide Splash screen once the App is loaded in react native using react-native-router-flux Hot Network Questions What happens if they run out of space on the Government benches in the House of Commons?

just use BackHandler for this. Documentation https://facebook.github.io/react-native/docs/backhandler

componentDidMount() {
    BackHandler.addEventListener('hardwareBackPress', this.handleBackPress);
  }

  componentWillUnmount() {
    BackHandler.removeEventListener('hardwareBackPress', this.handleBackPress);
  }

  handleBackPress = () => {

    return true;  // Do nothing when back button is pressed
  }

Handling Android Back Button Press in React Native, How do you handle the back button in react native? using the BackHandler from react native worked for me. Just include this line in your ComponentWillMount: BackHandler.addEventListener ('hardwareBackPress', function () {return true}) it will disable back button on android device. you can just remove super declaration in onBackPressed call back.

Since you are using expo this is the best place to look how splash screen works. splash-screens app-loading

BackAndroid/BackHandler Event Listeners are not Triggered when , Which callback of modal is fired when hardware back button is pressed? To handle the Android Back Button Press in the React Native we have to register the hardwareBackPress event listener with a callback function, which will be called after pressing the Back Button. We should also remove the listener when we are jumping out from the screen (where we have added the listener) because sometimes after going to the

SplashScreen.hide() failed on Android when quit app by back button , to reproduce launch app, splash show, hide as normal press back button and back to home screen(the app is not kill, crazycodeboy / react-native-splash-​screen SplashScreen.hide() failed on Android when quit app by back button and launch again #181 @kevinho do you use 'react-navigation'?  One of the ways to achieve that would be to show a splash screen. The splash screen can contain some information for the user. It may have an application’s logo or a progress bar. Let’s see how can we implement that in React Native. Depending on the type of the application, there are would be several ways of how to render a splash screen.

disable going back once navigate · Issue #1815 · react-navigation , how can I disable back arrow after navigated to another page? After Login screen, I sent to Main screen. but customer by mistake press back @nsisodiya if you are using react native navigator then on login button click just use this code yarn add react-native-splash-screen@3.0.6 react-native link react-native-splash-screen We then need to configure the package. From Xcode open the AppDelegate.m file.

How to disable back button after splash screen in React Native, ps : In this example, I'm using react-navigation 2 (the latest version is 3). SplashScreen.hide() failed on Android when quit app by back button , to reproduce launch  Splash Screen. In react native splash screen can be added natively and also using react-native-splash-screen package but I just did it in a very simple way by creating a splash screen component in my react-native side. I had to use set timeout to show the splash screen for few seconds and then redirect back to another screen.

Comments
  • How are you navigating from Splash screen to Main page ? Are you using React Navigation ? Some code would be helpful.
  • i just use this code >> componentWillMount(){ setTimeout(()=>{ this.props.navigation.navigate('Home'); }, 3000) } ====================================== after splash screen is gone and im in Home , i try to press back button and it back again to splash screen and stuck
  • but where should i use that? in app.js or splash.js ?
  • i just use this code >> componentWillMount(){ setTimeout(()=>{ this.props.navigation.navigate('Home'); }, 3000) } ========================================== i using this code for redirect to Home
  • it's work on every screen, How to Avoid that? or can you check here stackoverflow.com/questions/55306718/…
  • please review how to answer a question on stack overflow