Different layout title on children routes

  • Heelo,

    First post here as I am learning vue + Quasar. So far I loved them both.

    SO I have a route with a layout a several children route. I’d like to have a different title in the layout depending on the children. How can I pass the title up to the layout?


  • Hi Nico, and welcome!

    This is mostly a vue issue, but quasar does come with some helpers for this.

    Here are a couple ways you could do this:

    1. Route Meta
      When declaring your routes in router.js, add a meta field
      path: 'childroute',
      component: load('childcomponent'),
      meta: {
        title: 'Child component' 

    Then in your layout:

    1. Emit an event to update title
    1. Vuex
      Use a centralized store to hold the title. Then access in layout like so:

  • Hi Benoit,

    Thanks for your answer. Sorry if it was rather a vue issue. As I am learning both at the same time, I have hard time to tell sometimes. I guess I’ll go along your first solution.