这次给大家带来vue.js的嵌套路由(子路由)，使用vue.js嵌套路由(子路由)的注意事项有哪些，下面就是实战案例，一起来看一下。
children
嵌套路由,子路由插入到了父组件apple中
let router = new vrouter({ // 如果mode设为history, 那么地址就可以不使用哈希(# 哈希)了,就可以直接访问. http://localhost:8080/#/apple ==>> http://localhost:8080/apple mode: 'history', routes: [ // 做一个映射表 { path: '/apple', component: apple, // 嵌套路由,子路由插入到了父组件apple中 children: [ { path: 'red', component: redapple } ] }, { path: '/banana', component: banana } ] })
在父路由apple组件中,将redapple组件插入进来
<template> <div class="hello"> ....... <router-view></router-view> </div></template>
to red apple <router-link :to="{path:'apple/red'}">to red apple</router-link>
相信看了本文案例你已经掌握了方法，更多精彩请关注其它相关文章！
推荐阅读：
vue.js的vue标签属性和条件渲染
使用vue.js有哪些注意事项
以上就是vue.js的嵌套路由(子路由)的详细内容。