How to use Backhandler (React-Native)?

Question

I started learning about React-Turn on a little while ago and created an application. In it I put a button to return from scene that works normally, but when I try to use the back button of the mobile the application is closed.

Description that I have to use the command Backhandler to make the button of the phone back to scene too, but so far I have not found an example of code that tells exactly which parts should be adapted to each code and which should be maintained

This is the code example I found:

return (
        componentDidMount() {
        BackHandler.addEventListener('backPress', () => {
            const { dispatch, nav } = this.props
            if (shouldCloseApp(nav)) 
                return false
            dispatch({ type: 'Back' })
                return true
        })
    }

componentWillUnmount() {
      BackHandler.removeEventListener('backPress')
    }

But when I tried to put to run gave the error "Unespected toekn" on the command line "componentDidMount(){".

What I have to do?

Answer 1

I believe the error is in the location where you overwritten the componentWillMount() and componentWillUnmount functions()

The correct structure should be something like:

import React, { Component } from 'react';
import { View, BackHandler } from 'react-native';

class MyScreen extends Component {

  constructor(props){
    super(props);
  }

  componentDidMount() {
    BackHandler.addEventListener('backPress', () => {
      const { dispatch, nav } = this.props;
      if (shouldCloseApp(nav)) 
        return false;
      dispatch({ type: 'Back' });
      return true;
    });
  }

  componentWillUnmount() {
    BackHandler.removeEventListener('backPress')
  }

  render(){
    return(
      <View> {...} </View>
    )
  }
}