6、vue-router之命名路由和命名视图
1.首先来说说什么是命名路由？
就是在routers配置路由名称的时候给路由定义不同的名字，这样的好处就是可以在使用router-link的to属性跳转路由的时候传一个对象从而实现与router.push一样的效果：
<router-link :to="{ name: 'user', params: { userId: 123 }}">User</router-link>
等同于
router.push({ name: 'user', params: { userId: 123 }})
② 好了，具体手上实践看看到底应该怎么做
image
然后我们再到test.vue页面中，敲：
image
这时候我们去浏览器中点击，就发现用另一种方式实现了和普通路由跳转、编程式路由跳转一样的效果：
image
2.再来说说什么是命名视图
① 官方文档就说的很好嘛（https://router.vuejs.org/zh/guide/essentials/named-views.html）
简单来说就是，给不同的router-view定义不同的名字，通过名字进行对应组件的渲染。
② ok，现在我们进入路由页面，把先前写的全部删掉，以根路由来实践一下什么叫命名视图。我们在根路由下定义了三个组件
image
如果 router-view 没有设置名字，那么默认为 default。
image
④ 最后我们就可以看到效果
![]()
image
image
