## 路由的默认路径 >路由的默认路径: 让路径默认跳到到首页, 并且<router-view>渲染首页组件 >配置解析: 在routes中又配置了一个映射. path配置的是根路径: / redirect是重定向, 也就是我们将根路径重定向到/home的路径下, 这样就可以得到我们想要的结果了. ```javascript const routes = [ { path: '/', redirect : '/Home'}, ... ] ``` >默认情况下, 路径的改变使用的URL的hash. 使用HTML5的history模式: mode : 'history', ## **router-link补充** 1，tag: tag可以指定<router-link>之后渲染成什么组件, 比如上面的代码会被渲染成一个\<li>元素, 而不是\<a> `<router-link to='/home' tag='li'>` 2，replace: replace不会留下history记录, 所以指定replace的情况下, 后退键返回不能返回到上一个页面中, 3，active-class: 当<router-link>对应的路由匹配成功时, 会自动给当前元素设置一个router-link-active的class, 设置active-class可以修改默认的名称. ```javascript const router =new VueRouter({ routes, mode : 'history', linkActiveClass : 'active' }) ; ``` ## **动态路由**: path和Component的匹配关系 希望路径是：/user/aaaa或/user/bbbb ```javascript 路由脚本： { path: '/User/:use_id', component : User, // meta:{ title: "用户" } }, 主页使用： <router-link to="/user/cookie" replace tag="button" >主页新闻</router-link> User 组件使用： <p>{{$route.params.use_id}}</p> ```