SoFunction
Updated on 2025-03-01

ionic App Problem Summary Series: ionic Click the system to return key to exit the App

Under Android, if the system returns the key event is not processed, each time you click the return key, the page will be returned to the previous route. This logic does not conform to the app's routing logic. The correct thing should be: when the page reaches the homepage of each navigation page, pressing the return key then prompts whether to exit the app, and the user clicks to confirm and exit the app.

Add the following method in the run() method

$(function (e){
    //Block default behavior    ();
    // Exit the prompt box    function showConfirm() {
     var servicePopup = $({
      title: 'hint',
      subTitle: 'Are you sure you want to exit the app?  ',
      scope: $rootScope,
      buttons: [
       {
        text: 'Cancel',
        type: 'button-clear button-assertive',
        onTap: function () {
         return 'cancel';
        }
       },
       {
        text: 'confirm',
        type: 'button-clear button-assertive border-left',
        onTap: function (e) {
         return 'active';
        }
       },
      ]
     });
     (function (res) {
      if (res == 'active') {
       // Exit the app       ();
      }
     });
    }
     // Determine whether the current route is the homepage of each navigation bar. If yes, a prompt box will be displayed.    if ($() == '/index' || $() == '/product' || $() == '/account' || $() == '/more') {
     showConfirm();
    } else if ($()) {
     $();
    } else {
     showConfirm();
    }
    return false;
   }, 101); //101 priority is often used to override the default behavior of 'return to previous page' 

$()

This method is used to register the system return key event. Each click will only perform the behavior with the highest priority. For example, when there is a modal box on the page, clicking the system return key at this time will close the modal box instead of returning to the previous view.

Ionic has officially defined the priority of commonly used behaviors:

  • Return to previous view = 100;
  • Close the sidebar menu = 150;
  • Close Modal=200;
  • Close action sheet=300;
  • Close popup=400;
  • Close loading=500;

The usage is as follows:

registerBackButtonAction(callback, priority, [actionId])

So when you want to rewrite the above behaviors that are defined by ionic, you only need to set the priority of those behaviors that are greater than the priority. For example, what you want to override is the behavior of returning the previous view, then you only need to pass the incoming proirity value greater than 100 (and less than 150 at the same time).

The above is all the content of this article. I hope it will be helpful to everyone's study and I hope everyone will support me more.