在 Vue.js 中，可使用以下方法跳转路由：router-link 组件：声明式跳转，通过 <router-link> 组件指定跳转目标。router.push/replace 方法：编程式跳转，通过 router.push 添加新的路由到历史记录中，或通过 router.replace 替换当前路由。其他方法：还可使用 router.go、router.back 和 router.forward 方法。
Vue 中跳转路由
在 Vue.js 中，使用 router-link 组件或 router.push/replace 方法来跳转路由。
router-link 组件
router-link 组件声明式跳转到另一个路由：
立即学习“前端免费学习笔记（深入）”；
<code class="html"><template> <router-link to="/home">Home</router-link> </template> <script> // ... </script></code>
router.push/replace 方法
router.push 和 router.replace 方法编程式跳转到另一个路由。
router.push 会将新的路由添加到浏览器的历史记录中。router.replace 会替换当前路由，不会保留在历史记录中。用法：
<code class="javascript">import { useRouter } from 'vue-router'
export default {
setup() {
const router = useRouter()
const goToHome = () => {
router.push('/home')
}
return {
goToHome
}
}
}</code>其他方法
除了 router-link 和 router.push/replace 方法外，还有其他跳转路由的方法：
router.go(n)：相对当前路由向前或向后跳转 n 步。router.back()：返回到上一个路由。router.forward()：前进到下一个路由（仅当使用 router.back() 返回后有效）。以上就是vue怎么跳转路由的详细内容，更多请关注php中文网其它相关文章！
广告
收藏
收藏
收藏
Copyright 2014-2025 https://www.php.cn/ All Rights Reserved | php.cn | 湘ICP备2023035733号
336
