Vue 路由的使用及嵌套的子路由

目的：vue项目开发时用到子路由的嵌套

1.一开始使用：
<component v-bind:is="content"></component>

解决子组件的 切换的。通过改变content的赋值来实现加载子组件。

2. 但是当路径发生变化是比如多了子路由1中的组件就不能 满足使用了。

3.比如：#/Home/ Children

其中#/Home为 主路由页面，#/Home/ Children为子路由页面。

4.代码表示：

<div>

   <router-view>  

主内容

       <router-view>  

子内容

      <router-view/>

 </router-view>

</div>

5.路由控制

this.$router.push('/Home')主内容页面跳转到/Home页面中，this.$router.push('/Home/Children')主内容 

不变 子内容 切换组件。

6.总结：这样一来我们的 页面就可以想切换那里就切换那里。

官方 文档：https://router.vuejs.org/zh/guide/essentials/navigation.html