这种情况其实是Ionic的ion-back-button组件的默认行为导致的——它会根据路由栈的历史记录来决定显示的图标：

• 如果当前页面是路由栈的第一个页面（比如你直接访问了Register页面，而不是从Login页面导航过来的），组件会默认显示汉堡菜单图标（因为没有可返回的上一页），而且此时点击它不会有任何跳转行为（除非你设置了defaultHref）。
• 另外，如果你在App中配置了侧边菜单，start插槽的按钮有时候也会被菜单组件的默认逻辑覆盖，不过你的代码里主要还是路由栈的问题。

下面是几个可行的修复方法：

方法1：确保页面通过导航进入（推荐） #

Ionic的返回按钮依赖路由栈的历史，所以你需要确保Register页面是通过导航跳转进入的，而不是直接刷新或作为初始页面加载：

• 比如在Login页面中，用路由导航到Register：

// Angular 路由示例
import { Router } from '@angular/router';

constructor(private router: Router) {}

goToRegister() {
  this.router.navigate(['/register']);
}

这样路由栈中就会有Login的记录，ion-back-button就会自动显示箭头图标，点击也会正确返回上一页。

方法2：强制指定返回图标 #

如果你希望不管路由栈状态，都显示箭头图标，可以直接通过icon属性指定：

<ion-toolbar color="success">
  <ion-buttons slot="start">
    <ion-back-button defaultHref="/login" icon="arrow-back"></ion-back-button>
  </ion-buttons>
  <ion-title>Register</ion-title>
</ion-toolbar>

这样即使当前页面是路由栈的第一个页面，也会显示箭头图标，点击后会跳转到defaultHref指定的Login页面。

方法3：根据路由状态切换按钮显示 #

如果你的App同时需要返回按钮和菜单按钮，可以根据路由栈的状态动态切换显示：

<ion-toolbar color="success">
  <ion-buttons slot="start">
    <ion-back-button defaultHref="/login" *ngIf="hasBackHistory()"></ion-back-button>
    <ion-menu-button *ngIf="!hasBackHistory()"></ion-menu-button>
  </ion-buttons>
  <ion-title>Register</ion-title>
</ion-toolbar>

然后在组件中实现判断逻辑（以Angular为例）：

import { NavController } from '@ionic/angular';

constructor(private navCtrl: NavController) {}

hasBackHistory() {
  return this.navCtrl.canGoBack();
}

这样当有路由历史时显示返回按钮，没有时显示菜单按钮，逻辑更灵活。

内容的提问来源于stack exchange，提问作者jo1