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?

    Thanks
    Nicolas



  • 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:

    {{$route.meta.title}}
    
    1. Emit an event to update title
    1. Vuex
      Use a centralized store to hold the title. Then access in layout like so:
    {{$store.getters.pagetitle()}}
    


  • 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.

    Cheers


Log in to reply
 

Looks like your connection to Quasar Framework was lost, please wait while we try to reconnect.