单页上的Ionic自定义后退按钮

Question

我看了看：https://ionicframework.com/docs/api/config/Config/

本页使用了一个示例，其中离子选项卡上的选项卡位置针对该元素进行了更改。

我试着用重新创建这个

<ion-header>
<ion-navbar backButtonIcon="close">
<ion-title>settings-edit</ion-title>
</ion-navbar>
</ion-header>

<ion-content padding>
</ion-content>

导航栏返回按钮似乎没有任何变化

Answer 1

ionic中没有自定义的后退按钮选项，只需将其更改为按钮

<ion-header>
<ion-navbar hideBackButton="true">
<button ion-button menuToggle hideBackButton="true">
<ion-icon name="md-close" (click)="close()" ></ion-icon>
</button>
<ion-title>settings-edit</ion-title>
</ion-navbar>
</ion-header>

尝试此代码并在您的页面中添加以下TS代码

close()
{
this.navctrl.pop();
}

Answer 2

在文档中，您应该在app.module.ts中定义它

将此添加到您的@NgModule:

imports: [
BrowserModule,
IonicModule.forRoot(MyApp, {
backButtonIcon: 'close',
iconMode: 'ios',
modalEnter: 'modal-slide-in',
modalLeave: 'modal-slide-out',
tabsPlacement: 'bottom',
pageTransition: 'ios-transition'
}) 
]