Ionic2/3 - 标题按钮图标具有不同的大小,然后自动后退按钮

Question

我在使用NavController时正在使用Ionic的2/3自动按钮.

在其中一个页面上,我想在标题中添加按钮,这会改变一些内容,所以我添加了它:

<ion-header>
  <ion-navbar color="orange">
    <ion-title>Test</ion-title>
    <ion-buttons end>
      <button ion-button icon-right clear (click)="openModal()">
        Next <ion-icon name="arrow-forward"></ion-icon>
      </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

不幸的是,图标的大小略有不同(较小),然后由Ionic自动添加后退按钮.我知道我可以用CSS来设置它,但我害怕破坏它(我无法测试所有设备).

屏幕截图(Android和iOS):

也许我应该使用不同的按钮类或组件？如何使标题中的所有按钮和图标的大小相同？

Answer 1

您可以使用仅图标指令，仅此而已。这种方式就是后退按钮。

<ion-buttons end>
   <button ion-button icon-right icon-only clear (click)="openModal()">
      Next <ion-icon name="arrow-forward"></ion-icon>
   </button>
</ion-buttons>