Ionic 2自定义后退按钮动作

Question

我想自定义此屏幕截图中提到的后退按钮的单击操作。我希望通过点击我不会返回到上一页，而是返回到我自己指定的页面，或者在返回之前进行处理。

Answer 1

对于自定义默认后退按钮操作，您需要覆盖NavBar组件的 backButtonClick（）方法。

第1步：在＆＃34; custom-class.ts＆＃34; 导入Navbar组件中。创建auxMethod以覆盖默认行为并在ionViewDidLoad方法中调用。

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

export class myCustomClass {
    @ViewChild(Navbar) navBar: Navbar;

    ionViewDidLoad() {
        this.setBackButtonAction()
    }

    //Method to override the default back button action
    setBackButtonAction(){
       this.navBar.backButtonClick = () => {
       //Write here wherever you wanna do
          this.navCtrl.pop()
       }
    }
}

此代码已在离子3中进行了测试。

Answer 2

您可以尝试使用ionViewCanLeave or ionViewWillLeave事件。

请参阅此issue #9533并提出建议，以区分＆＃34;返回＆＃34;导航。一旦实现，这对您的用例非常方便。

Answer 3

您只需从ViewController堆栈中删除当前索引

从“ ionic-angular”导入{ViewController};

      constructor(public navCtrl: NavController, public viewCtrl: ViewController) {
      }


this.navCtrl.push("APage").then(() => {
      const index = this.viewCtrl.index;
      this.navCtrl.remove(index,1);
    });