在vue-router文档,嵌套路由一节,给了一个例子:vue
const router = new VueRouter({ routes: [ { path: '/user/:id', component: User, children: [ { // 当 /user/:id/profile 匹配成功, // UserProfile 会被渲染在 User 的 <router-view> 中 path: 'profile', component: UserProfile }, { // 当 /user/:id/posts 匹配成功 // UserPosts 会被渲染在 User 的 <router-view> 中 path: 'posts', component: UserPosts } ] } ] })
后面有一句加粗的话:vue-router
要注意,以 /
开头的嵌套路径会被看成根路径。 这让你充分的使用嵌套组件而无须设置嵌套的路径。
这句话不是很理解。json
今天配置路由的时候,碰到一个诡异的状况:浏览器
const router = new VueRouter({ routes: [ { path: '/user', component: User, }, { name: 'user2', path: 'user2', // 此处没加斜杠 component: User2, }, ] })
而后在使用的时候,使用name:post
<router-link :to="{ name: 'user2', params: {} }" exact>连接</router-link>
这时,在浏览器地址栏,会显示成:spa
http://localhost:8080/user/user2
这两个路由,在配置时候是同级的,显示的时候,渲染的router-view
也是同级的。可是在地址栏的语义上,是有从属关系的。这里咱们是否是能够得出一个结论:没有以code/
开头的路径,会被处理成嵌套路径,跟在前一个路径的后面。
更正:
没有以/
开头的路径,会被处理成嵌套路径,跟在当前页面的顶级路径后面,并且不能刷新,一刷新就会找不到页面。
这里的当前页面顶级路径是 component
http://localhost:8080/user
/user2router
PS:
发现了一个淘宝的拼音bug
前两天研究淘宝购物车的优惠券展现,发现返回的json数据里,优惠券拼音是错误的,?blog