vue3 新开页面路由跳转方法
时间: 2023-10-07 10:11:20 浏览: 100
在 Vue 3 中,你可以使用 `router` 对象进行页面路由跳转。以下是几种常用的方法:
1. 使用 `router.push` 方法进行路由跳转:
```javascript
// 在组件中
this.$router.push('/new-page')
// 在非组件的地方(例如在方法中)
import { useRouter } from 'vue-router'
const router = useRouter()
router.push('/new-page')
```
2. 使用 `router.replace` 方法进行路由替换(不会留下浏览器历史记录):
```javascript
// 在组件中
this.$router.replace('/new-page')
// 在非组件的地方
import { useRouter } from 'vue-router'
const router = useRouter()
router.replace('/new-page')
```
3. 使用 `router.go` 方法进行路由导航到指定的历史记录位置:
```javascript
// 在组件中
this.$router.go(1) // 前进一个历史记录位置
this.$router.go(-1) // 后退一个历史记录位置
// 在非组件的地方
import { useRouter } from 'vue-router'
const router = useRouter()
router.go(1)
router.go(-1)
```
这些方法可以帮助你实现在 Vue 3 中的页面路由跳转。记得在使用之前,确保已经正确配置了 Vue Router。