Блог

Я не уверен, возможно ли это, но вот:

Я пытаюсь сделать так, чтобы в заголовке страницы (метатеге) отображалось имя пользователя профиля, в котором вы находитесь в данный момент. Мой код выглядит следующим образом:

 export default new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/profile/:userId/",
      name: "profile",
      component: Profile,
      meta: {
        title: "Profile - ((USERID HERE))", // <-- Find how to insert :userId into page title
      },
    },
 

Какие-либо советы о том, как это сделать, или возможно ли вообще иметь динамические заголовки страниц с помощью маршрутизатора vue? Спасибо.

Вам нужно будет установить заголовок для каждой записи маршрутизатора

 const router = new Router({
  mode: "history",
  base: process.env.BASE_URL,
  routes: [
    {
      path: "/profile/:userId/",
      name: "profile",
      component: Profile,
      meta: {
        title: "Profile - ((USERID HERE))", // <-- Find how to insert :userId into page title
      },
    },
//Other properties
})

router.beforeEach((to, from, next) => {
 // You have access to the route here so you could dynamically get the variable? to.params? (Sorry for editing this post as didn't see the full question!)

 document.title = to.meta.title ? to.meta.title : "Some Default Title"

 // Edit 2 it seems params contains the thing you need so you could detect if to.meta.title is a thing and dynamically change it `Profile - (${to.params.userId})`
 next() // You must call next!
})

export default router
 

вы можете использовать реквизит маршрутизатора в качестве функции, поэтому вместо передачи реквизита userId , передайте реквизит title примерно так:

 routes: [
    {
      path: "/profile/:userId",
      name: "profile",
      component: Profile,
      props: route => ({ title: `Profile ${route.params.userId}` })
    },
]
 

вы можете прочитать больше об этом в документах vue