Ionic 2 设备后退按钮阻止应用程序在选项卡中退出

Question

我是离子框架的新手。

我遇到了关于 ionic-2 应用程序选项卡的问题，我的应用程序视图中有 3 个选项卡，一个是发现选项卡，其他是人员和消息……我遇到的问题是，当我在消息和人员选项卡上时从我的 phone 后退按钮按下我只是简单地退出我的应用程序...... 我想要的是，当我点击其他选项卡时，我只需转到我的主页，即发现页面，如果我按回去，我会从那里退出应用程序……任何人对此有任何想法，请告诉我，我将不胜感激你……

Answer 1

您可以通过注册新的后退按钮操作来解决此问题。在我的一个项目中，我用它来创建一个警报，以防止用户关闭应用程序。你可以询问 navCtrl 你现在在哪个页面然后重定向用户，而不是关闭应用程序。

这里有一个小片段，可以引导您找到解决方案：

this.platform.registerBackButtonAction(() => {
    let nav = this.app.getActiveNav();
    if (...){ // Ask what the current page is.
      // use setRoot on navCtrl to redirect to your preferred page
    }else{
      this.platform.exitApp();
    }
  });

Answer 2

我是这样解决这个问题的：

import { Navbar, Platform } from 'ionic-angular';
import { ViewChild } from '@angular/core';

export class Some_Page_With_Your_Three_Tabs {

    public backButtonAction: any;

    tab1Root = MainTab;        // your first tab
    tab2Root = MessagesTab;    // your second tab
    tab3Root = PeopleTab;      // your third tab

    @ViewChild(Navbar) navBar: Navbar;

    constructor(public platform: Platform, public navCtrl: NavController, public navParams: NavParams) {
    }

    ionViewDidEnter() {
        this.backButtonAction = this.platform.registerBackButtonAction(() => { 
            this.customHandleBackButton();
        }, 10);
        this.navBar.backButtonClick = (e: UIEvent) => { 
            this.customHandleBackButton();
        };
    }

    private customHandleBackButton(): void {
        if (weCanLeave) {
            this.navCtrl.pop({ animate: false });
        } else {
            return;
        }
    }
}

Ionic 2 设备后退按钮阻止应用程序在选项卡中退出

Ionic 2 device back button prevent app exit in tabs

ionic2