fix(react): remove hardware back button event listener when NavManager is unmounted (#23224)

resolves #23170

packages/react-router/test-app/cypress/support/commands.js

@@ -123,3 +123,7 @@ Cypress.Commands.add('ionMenuClick', () => {
   //   .click()
   // cy.get('ion-menu.show-menu').should('exist');
 });
+
+Cypress.Commands.add('ionHardwareBackEvent', () => {
+  cy.document().trigger('backbutton');
+});

packages/react/src/routing/NavManager.tsx

@@ -33,6 +33,8 @@ interface NavManagerProps {
 }
 
 export class NavManager extends React.PureComponent<NavManagerProps, NavContextState> {
+  _isMounted = false;
+
   ionRouterContextValue: IonRouterContextState = {
     push: (
       pathname: string,
@@ -68,15 +70,31 @@ export class NavManager extends React.PureComponent<NavManagerProps, NavContextS
     };
 
     if (typeof document !== 'undefined') {
-      document.addEventListener('ionBackButton', (e: any) => {
+      this.handleHardwareBackButton = this.handleHardwareBackButton.bind(this);
-        e.detail.register(0, (processNextHandler: () => void) => {
+      document.addEventListener('ionBackButton', this.handleHardwareBackButton);
-          this.nativeGoBack();
-          processNextHandler();
-        });
-      });
     }
   }
 
+  componentDidMount() {
+    this._isMounted = true;
+  }
+
+  componentWillUnmount() {
+    if (typeof document !== 'undefined') {
+      document.removeEventListener('ionBackButton', this.handleHardwareBackButton);
+      this._isMounted = false;
+    }
+  }
+
+  handleHardwareBackButton(e: any) {
+    e.detail.register(0, (processNextHandler: () => void) => {
+      if (this._isMounted) {
+        this.nativeGoBack();
+        processNextHandler();
+      }
+    });
+  }
+
   goBack(route?: string | RouteInfo, animationBuilder?: AnimationBuilder) {
     this.props.onNavigateBack(route, animationBuilder);
   }