vue3中的router和useRouter的区别

结论:从vue-router的官方文档中发现,useRouter需要在setup中使用,而router可以在任何组件中使用。 二者是等价的,适用场景不同。

问题:使用useRouter创建的实例,未能成功调用方法push()。会报错:Uncaught (in promise) TypeError: Cannot read properties of undefined (reading 'push')

javascript 复制代码
//错误场景:在js中调用useRouter
import { useRouter } from 'vue-router' 
const router = useRouter()

router.push({path:'/login'})

解决:改用router。

javascript 复制代码
import router from @/router'
router. push('/pathname')

原因:因为 useRouter只能在 setup中使用,如 以下场景:

router 适用面更广

参考:

vue3中的路由传参以及router和route的区别_useroute和userouter的区别_莫尔道嘎老范的博客-CSDN博客

vue3路由的两种引入方式useRouter和router进行页面跳转_userouter()_qq_26596795的博客-CSDN博客

相关推荐
薛先生_0992 分钟前
vue-路由模块封装
前端·javascript·vue.js
薛先生_0993 分钟前
vue-router-link实现导航高亮效果
前端·javascript·vue.js
郑州光合科技余经理4 分钟前
海外版外卖系统源码:支付/地图/多语言核心代码实现
android·java·前端·后端·架构·uni-app·php
古韵16 分钟前
TanStack Query 被高估了?这 5 个场景它真不如 alova
前端
颂love26 分钟前
Vue3基础入门
前端·学习·vue3
风吹夏回26 分钟前
Vue 3 路由使用完全指南
前端·vue.js
创业之路&下一个五年30 分钟前
JS编程范式 \& 面向对象范式
开发语言·前端·javascript
whatever who cares32 分钟前
完整的Vue3项目文件结构
vue.js
李白你好32 分钟前
DesJsFinder被动JS分析 + 框架识别 + 主动Fuzz + 响应指纹 — 红队API挖掘利器
javascript
ct97833 分钟前
Axios 请求取消
前端·javascript·vue.js