Vue路由(vue-router)03(子路由)

对于单页面的vue应用,子路由的配置可能是必不可少的,其实vue的子路由配置很简单。这篇文章是基于上一片文章(路由配置02)的。

示例需求,早footer.vue模块中配置子路由(示例文件footer01.vue和footer02.vue)。

1. 在components文件夹下新建一个children文件夹,在其中新件子路由文件。(children文件夹名称不限制,子路由文件的位置不限制,可以直接新建在components文件夹中)。

components文件夹

2. 在router.js(路由的配置文件)中配置子路由。

router.js

3. 在footer.vue文件中设置子路由锚点(router-link和router-view)。

footer.vue

4. 路由配置02文档中的main.js不变,直接运行项目。

如果要配置一个三级路由,配置方式和当前二级路由的配置方式是一样的。



作者:_关耳_
链接:https://www.jianshu.com/p/fd57cdef7712
來源:简书
简书著作权归作者所有,任何形式的转载都请联系作者获得授权并注明出处。

猜你喜欢

转载自blog.csdn.net/heyuqing32/article/details/85016148
今日推荐