当前位置: 首页 > news >正文

vue3-在自定义hooks使用useRouter 报错问题

文章目录

  • 前言
  • 一、报错分析
      • 报错的Vue warn截图:
      • 查看文档
  • 二、那么在hook要怎么引入路由呢?


前言

记录在vue3项目中,hook使用useRouter 报错问题


一、报错分析

报错的Vue warn截图:

在这里插入图片描述
警告 inject() can only be used inside setup() or functional components.
** 直接机翻:Inject()只能在setup()或功能组件中使用。**

查看文档

因为我们在 setup 里面没有访问 this,所以我们不能再直接访问 this. r o u t e r 或 t h i s . router 或 this. routerthis.route。作为替代,我们使用 useRouter 和 useRoute 函数:
在这里插入图片描述

一开始还以为是 const $router = useRouter() 调用时机 1 ,2 ,3 位置都是 $router ==> undefined

在这里插入图片描述
断点调试
在这里插入图片描述

二、那么在hook要怎么引入路由呢?

在这里插入图片描述
这样引入就可以了

 import $router from "@/router"

http://www.lryc.cn/news/248642.html

相关文章:

  • 深度学习框架:Pytorch与Keras的区别与使用方法
  • 1145. 北极通讯网络(Kruskal,并查集维护)
  • 【23-24 秋学期】NNDL 作业9 RNN - SRN
  • Docker + Jenkins + Nginx实现前端自动化部署
  • 文生视频的发展史及其原理解析:从Gen2、Emu Video到PixelDance、SVD、Pika 1.0
  • 【python+Excel】读取和存储测试数据完成接口自动化测试
  • WordPress插件大全-免费的WordPress插件汇总
  • STM32通讯设计
  • 外汇天眼:在QOINTEC投资需缴纳分成费才给出金?这合理么?
  • C_8练习题
  • HuggingFace学习笔记--Tokenizer的使用
  • 解决苹果手机iphone手机强制重启
  • 10分钟的时间,带你彻底搞懂JavaScript数据类型转换
  • 好用的chatgpt工具用过这个比较快
  • 系统设计概念:生产 Web 应用的架构
  • 基于docker的onlyoffice使用--运行JavaSpringExample
  • SQL server-excel数据追加到表
  • 深度学习-模型调试经验总结
  • Redis打包事务,分批提交
  • 深度学习毕设项目 深度学习 python opencv 动物识别与检测
  • leetcode 611. 有效三角形的个数(优质解法)
  • Ubuntu使用Nginx部署前端项目——记录
  • 小航助学题库蓝桥杯题库c++选拔赛(22年1月)(含题库教师学生账号)
  • centos用户相关命令
  • 智能优化算法应用:基于哈里斯鹰算法无线传感器网络(WSN)覆盖优化 - 附代码
  • Stability AI 新发布SDXL Turbo:一款实时文本到图像生成模型
  • 基于Java SSM框架+Vue实现病人跟踪治疗信息系统项目【项目源码+论文说明】
  • js一行压缩库
  • 管理库存和出货的软件
  • 保护关键信息基础设施网络安全,SSL证书来助力