Using toolbar with menu as a component

Hey,

This is my first Vue/ Ionic project and I am having trouble reusing a component that wraps a toolbar with a back button and a menu-button that toggles a menu. I want to use that component on all of my views except the login/signup page. So I thought it makes sense to create a component instead of redefining the menu every time. It takes props for the title and a boolean to decide whether or not a back button should be shown. The component works totally fine but if I use the menu to navigate to another page and use the back button the whole menu-button stops working and the menu is not able to toggle until I refresh.
Is there a best practice to use a toolbar with a menu through your whole application without repeating yourself or am I doing something wrong?

<template>
    <ion-menu side="end" content-id="main-content">
       ...
    </ion-menu>

    <div id="main-content">
      <ion-header>
        <ion-toolbar>
          <ion-buttons slot="start" v-if="hasBackButton">
            <ion-back-button default-href="/home"></ion-back-button>
          </ion-buttons>
          <ion-title>{{ title }}</ion-title>
          <ion-buttons slot="end">
            <ion-menu-button></ion-menu-button>
          </ion-buttons>
        </ion-toolbar>
      </ion-header>
    </div>
</template>

1 post - 1 participant

Read full topic