vue如何跳转到当前页面的子页面
时间: 2023-08-14 14:03:24 浏览: 119
基于vue循环列表时点击跳转页面的方法
在 Vue 中,如果要跳转到当前页面的子页面,可以使用嵌套路由的方式来实现。具体步骤如下:
1. 在父组件的路由配置中添加子路由配置,例如:
```javascript
{
path: '/parent',
component: ParentComponent,
children: [
{
path: 'child',
component: ChildComponent
}
]
}
```
2. 在父组件中使用 `<router-view>` 标签来渲染子页面,例如:
```html
<template>
<div>
<h1>Parent Component</h1>
<router-view></router-view>
</div>
</template>
```
3. 在父组件中使用 `<router-link>` 标签来跳转到子页面,例如:
```html
<template>
<div>
<h1>Parent Component</h1>
<router-link to="/parent/child">Go to Child Component</router-link>
<router-view></router-view>
</div>
</template>
```
这样就可以在父组件中跳转到子页面了。注意,在跳转时需要指定完整的子页面路径,例如 `/parent/child`。
阅读全文