router-link 与 router-view是什么东西？

初学者理解了SPA(single page web application)，就更容易理解vue中 router-link 与 router-view是什么东西？

1、router-link中

//如导航代码
 <router-link class="nav-link" to="ContactUs">联系我们</router-link>

通过router-link可以使<router-view/>中的显示内容路由（跳转）到src/router/index.js文件中配置的组件中去，这类似于html的a标签中的href（注意：href页面会刷新，在这里则不会），其实这就好比tab选项卡中的头部选项，router-view好比tab选项卡的body选项。

2、router-view

<router-view><router-view/>（命名视图）

<router-view/>（嵌套命名视图）

<router-view> 是用来渲染通过路由映射过来的组件，当路径更改时， 其中的内容也会发生更改

主要应用于单页面中，与router-link配合，渲染router-link 映射过来的组件。

运作过程：就是几个跳转链接跳到对应的子页面，程序运行的时候，会将<template>标签里面的内容都注入到App.vue页面中的router-view标签中，从而实现无刷新的路由跳转。