<router-view> 组件是一个 functional 组件，渲染路径匹配到的视图组件。<router-view> 渲染的组件还可以内嵌自己的 <router-view>，根据嵌套路径，渲染嵌套组件。
如果中最外层的<router-view>中增加了:key="$route.fullPath", 会导致子路由中的router-view之外的部分也会被重新渲染，key值的使用应该考虑不干扰其他组件渲染的前提下去添加，例如header组件
// 这个是根路由，下面有包含header的子路有，每次切换路由，header都会被同步刷新 <transition name="fade"> <router-view :key="$route.fullPath" /> </transition>
// 子路由 <Header /> <router-view />
key值添加是为了以下几点
1. 不设置 router-view 的 key 属性由于 Vue 会复⽤相同组件，即 /page/a => /page/b 或者 /page?id=a => /page?id=b 这类链接跳转时，将不再执⾏ created ， mounted 之类的钩⼦，这时候你需要在路由组件中，添加beforeRouteUpdate 钩⼦来执⾏相关⽅法拉取数据。
2. 设置 router-view 的 key 属性值为 $route.path从 /page/a => /page/b ，由于这两个路由的 $route.path 并不⼀样，所以组件被强制不复⽤，相关钩⼦加载顺序为 beforeRouteUpdate => created => mounted
3. 设置 router-view 的 key 属性值为 $route.fullPath从 /page/a => /page/a ，由于这两个路由的 $route.fullPath 并不⼀样，所以组件被强制不复⽤，相关钩⼦加载顺序为beforeRouteUpdate => created => mounted
4. 从 /page?id=a => /page?id=b ，由于这两个路由的 $route.fullPath 并不⼀样，所以组件被强制不复⽤。