路由

1.1 路由组成

• VueRouter：路由器，根据路由请求在路由视图中动态渲染对应的视图组件

• <router-link>：路由链接组件，浏览器会解析为<a>

• <router-view>：路由视图组件，用来展示与路由路径匹配的视图组件

  

  

1.2 路由跳转

• 标签式：<router-link to="/">Home<router-link>
• 编程式：方法内部调用 this.$router.push('/')

1.3 404

如果前面的路径都没有匹配到，就会匹配到最后一个'*' ，重定向到404页面

1.4 嵌套路由

• 在组件内要切换内容时，就需要用到嵌套路由

  

• 配置

  

• 使用

  <el-container>
    <el-aside width="200px">侧边栏放<router-link to></el-aside>
    <el-container>
      <el-header>Header</el-header>
      <el-main>这里放具体要展示的页面组件<router-view></el-main>
    </el-container>
  </el-container>

• 设置子路由默认访问页面