vue最简单的入门教程+实战+Vue2+VueRouter2+webpack(五)

vue入门之路篇系列教程:
vue最简单的入门教程+实战+Vue2+VueRouter2+webpack(一)
vue最简单的入门教程+实战+Vue2+VueRouter2+webpack(二)
vue最简单的入门教程+实战+Vue2+VueRouter2+webpack(三)
vue最简单的入门教程+实战+Vue2+VueRouter2+webpack(四)
vue最简单的入门教程+实战+Vue2+VueRouter2+webpack(五)

前言

通过前面几章的实战,我们已经顺利的构建项目,并且从API接口获取到数据并且渲染出来了。制作更多的页面,更复杂的应用,就是各位自己根据自己的项目去调整的事情了。

在vue中,我们使用vue-router来进行路由的构建,如果想学习可以去看:vue-router文档

很简单但是不上实战你永远不知道它写的什么,是什么意思?

本章就讲一下如何配置子路由,因为我们的项目不可能只有一个页面,而是由众多页面构成的。

新建子路由页面

在第二节中,我们新建了一个src/frame/subroute.vue的子页面。当时是留空放在那里的。这里,我们给它填写上内容,代码如下: