[Vuejs]-Passing component name to title field in Vue app

by

3👍

✅

Hi Jasper try this way.

Go to your route and and a meta on the router you want to have a title on like the code below

const routes = [
  {
    path: "/",
    name: "Home",
    component: Home,
    meta: {
      title: 'Home'
    }
  },
]

And go to your App.vue and add this a watch to look up when you go to different pages if you dont have a meta with a title it will put a default value on the website title.

export default {
  watch: {
    '$route' (to) {
      document.title = to.meta.title || 'Default Title'
    }
  },
};

I hope this solves your problem have a nice day !

👤Kivanc Özmen

Leave a comment