Ionic 2 设备后退按钮可防止应用程序在选项卡中退出答案

【问题标题】：Ionic 2 device back button prevent app exit in tabsIonic 2 设备后退按钮可防止应用程序在选项卡中退出
【发布时间】：2018-04-16 11:30:18
【问题描述】：

我是 ionic 框架的新手。

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

【问题讨论】：

您可以在ionic stackoverflow.com/questions/42151944/…配置硬件返回按钮

标签： ionic2

【解决方案1】：

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

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;
        }
    }
}

【讨论】：

注意；导航到其他页面时移除监听器。
我还没测试过，我要去
如果（我们可以离开）。这是什么？ @德米特里
我正在导入“Nav”而不是“Navbar”所以我应该在“this.navBar.backButtonClick”中使用什么我在导航中看不到backButtonClick的任何功能...... @Dmitry跨度>
您需要准确导入“导航栏”。在文档中您可以阅读：“Navbar 充当导航工具栏，还带有后退按钮。” ionicframework.com/docs/api/components/toolbar/Navbar@usman

【解决方案2】：

您可以通过注册一个新的 backButton-Action 来解决这个问题。在我的一个项目中，我用它来创建一个警报，以防止用户关闭应用程序。您可以询问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();
    }
  });

【讨论】：