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

问题描述

如何将“后退”按钮对准工具栏的左侧,将“汉堡包”菜单图标对准工具栏的右侧。谁能帮忙吗?

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

当前结果

image

解决方法

只需添加另一个IonButtons并为其提供一个slot属性(startend)。那应该使工具栏中的按钮对齐。

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