本文介绍了Vue-router中如何设置子路由，适用于需要在父模板基础上构建多个子页面的场景。首先，在components目录下创建子组件，然后在父组件中引入并指定插入位置。接着，配置子组件的数据以展示不同内容。在router/index.js中，为父路由添加children数组，包含子路由的path和component。最后，确保引入子组件。示例展示了在demot父模板下的demot1和demot2子模板的实现效果。
vue-router中的子路由，子路由的情况一般用在一个页面有它的基础模版，然后它下面的页面都隶属于这个模版。
假设demot模板是父模板，现在新建demot1和demo2两个子模板
新建子路由的步骤：
1.在src/components目录下新建demot1.vue和demot2.vue两个组件模板
2.在父模板引入<router-view>标签，给子模板提供插入位置。
<template>
<div>
<p style="color:red">这是demot页面</p>
<router-view></router-view>
</div>
</template>
3.在子模板中，设置输出的内容，改变data中的content。
在demot1模板中输出这是demot1页面，在demot2模板中输出这是demot2页面
demot1模板的代码：
<template
1502
374
7080
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
最低0.47元/天 解锁文章
