vue二级路由跳转

主页跳转到我的页面(My.vue),‘我的页面’又有很多子页面,点击子页面显示对应内容。
vue二级路由跳转_第1张图片
vue二级路由跳转_第2张图片
方法一:
在router/index.js里:
引入组件(路径因人而异):
vue二级路由跳转_第3张图片
然后进行配置(其余子组件同orders写法):
vue二级路由跳转_第4张图片
在父组件(此时二级路由的父组件为My.vue)的根标签里写出口
在父组件里,可以用v-for遍历配合自己写的method实现路由,比如:
vue二级路由跳转_第5张图片
data里定义一个lists:
vue二级路由跳转_第6张图片
点击时,执行方法,动态传路由路径:
vue二级路由跳转_第7张图片
方法二(未完待续):
在router/index.js里:
引入组件,子组件写在父组件的children里:
使用children写子组件遇到问题,就是在我的页面点击子页面的时候,浏览器显示路径变了,但是展示为空白页面。
这个还没有找到解决办法。

你可能感兴趣的:(VUE)