vue-router的routes中name属性作用详解

export default new Router({
  mode: 'history',
  routes: [
    {
      path: '/',
      name: 'Hello',
      component: Hello
    }, {
      path: '/text',
      name: 'text',
      component: text
    }, {
      path: '/text/:id',
      component: param
    }
  ]
})

第一种用法：

通过name属性，为一个页面中不同的router-view渲染不同的组件,如：将上面代码的Hello渲染在 name为Hello的router-view中，将text渲染在name为text的router-view中。不设置name的将为默认的渲染组件。

第二种用法：

可以用name传参 使用$router.name获取组件name值

第三种用法：

用于pramas传参的引入 pramas必须用name来引入 query可以用name或者path来引入（不明白vue-router传参的可以参考我的另一篇文章vue-router中 query传参和params传参的区别和注意事项）

   var router = new VueRouter({
      routes: [
        { name:'register', path: '/register/:id/:name', component: register }
      ]
    })
   注册

转载自：https://blog.csdn.net/alokka/article/details/84318734