Ionic : Hardware Back Button Event Listener not executed when modal is open-CodePudding

In ionic framework when the hardware back button is pressed the following event listener method is executed.

document.addEventListener('ionBackButton', (ev) => {
   ev.detail.register(10, () => {
   console.log('Handler was called!');
 });
});

But when a modal kept opened then the above method is not executed after pressing the hardware back button. It shows only the following message on the console of android studio

Notifying listeners for event backButton

Updated :

the following code is for the modal in ionic react

import React, { useState } from 'react';
import { IonModal, IonButton, IonContent } from '@ionic/react';

export const ModalExample: React.FC = () => {
  const [showModal, setShowModal] = useState(false);

  return (
    <IonContent>
      <IonModal isOpen={showModal} cssClass='my-custom-class'>
        <p>This is modal content</p>
        <IonButton onClick={() => setShowModal(false)}>Close Modal</IonButton>
      </IonModal>
      <IonButton onClick={() => setShowModal(true)}>Show Modal</IonButton>
    </IonContent>
  );
};

CodePudding user response：

I have found the solution for triggering the hardware back button event listener method, simply by increasing the priority up to 140.

document.addEventListener('ionBackButton', (ev) => {
   ev.detail.register(140, () => {
   console.log('Handler was called!');
 });
});