使用 Ionic 和 React 对齐工具栏中的按钮

Question

如何将后退按钮对齐到工具栏的左侧，并将汉堡包菜单图标对齐到工具栏的右侧。有人可以帮忙吗？

<IonToolbar mode="ios">
  <IonButtons slot="start">
    <IonBackButton defaultHref={route} />
    <IonMenuButton color="dark" />
  </IonButtons>
  <IonTitle>
    App Title
  </IonTitle>
</IonToolbar>

当前结果

Answer 1

只需添加另一个 IonButtons 并在其上添加 slot 属性（start 或 end）。那应该对齐工具栏中的按钮。

<IonToolbar mode="ios">
  <IonButtons slot="start">
    <IonBackButton defaultHref={route} />
  </IonButtons>
  <IonButtons slot="end">
     <IonMenuButton color="dark" />
  </IonButtons>
  <IonTitle>
    App Title
  </IonTitle>
</IonToolbar>

使用 Ionic 和 React 对齐工具栏中的按钮

Align buttons in toolbar using Ionic with React

reactjs

ionic-framework

ionic5