javascript - 我如何通过vue路由器传递自定义属性

Question

我有一个路由实例:

const router = new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: MainContainer,
      redirect: '/news/list',
      children: [
        {
          path: 'advertisement/create',
          name: 'Create Advertisement',
          title: 'This is title of the page'
          component: CreateAdvertisement
        }
      ]
    }
  ]
})

在我的组件中，我试图控制 this.$route 但我只得到名称、路径、组件并且那里没有标题属性。所以我的问题是:通过 Vue 路由器传递自定义属性是否有效？如果有，我尝试的问题在哪里？

Answer 1

您可以添加到元数据中:

 const router = new Router({
  routes: [
    {
      path: '/',
      name: 'Home',
      component: MainContainer,
      redirect: '/news/list',
      children: [
        {
          path: 'advertisement/create',
          name: 'Create Advertisement',
          title: 'This is title of the page'
          component: CreateAdvertisement,
          meta:{
           // here
           key: value
          }
        }
      ]
    }
  ]
})

https://router.vuejs.org/guide/advanced/meta.html