ionic4 不配置代码的时候android自带的返回键是没有效果的。我们采用的是这种方式:
import { Component, HostListener } from '@angular/core';
@HostListener('document:ionBackButton', ['$event'])
private overrideHardwareBackAction($event: any) {
$event.detail.register(100, async () => {
// Do what you want
this.router.navigateByUrl('相应路径');
});
}
但是其中填写跳转路径的话每个页面都要配置此代码。
因为我们公司项目中每个子页面右上角都有返回键:所以我就在这里处理了:
子页面代码:
<ion-header>
<ion-toolbar>
<ion-buttons slot="start">
<ion-back-button [defaultHref]="defaultHref" text="返回" id='backButton'></ion-back-button>
</ion-buttons>
<ion-title style="margin-left: 11%">人员新参保</ion-title>
</ion-toolbar>
</ion-header>
在没有返回键的页面,比如tab页面和login页面中增加
<input id="backButtonTab" type="hidden" (click)='backMethod()' />
backMethod(){
//do what you want
}
在tabs-page.ts 中
@HostListener('document:ionBackButton', ['$event'])
private overrideHardwareBackAction($event: any) {
$event.detail.register(100, async () => {
// Do what you want
let tmp = document.getElementById("backButton");
if(tmp){
tmp.click();
}else{
document.getElementById("backButtonTab").click();
}
});
}
需要不同的返回键功能的时候加入相应的click方法就可以了,
以上是我的解决方法,如果大佬有更好的解决方法,请告诉小弟啊。
转发请标明出处。