vue3+ts 项目遇到的问题和bug

1.router中使用pinia报错

在这里插入图片描述

pinia.mjs:1709 Uncaught Error: [🍍]: "getActivePinia()" was called but there was no active Pinia. Are you trying to use a store before calling "app.use(pinia)"?
See https://pinia.vuejs.org/core-concepts/outside-component-usage.html for help.
This will fail in production.at useStore (pinia.mjs:1709:19)at index.ts:6:15

分析原因:因为在mian.js中,注册router总比pinia先,所以不能使用到store/index.js文件中createPinia方法

解决方法:把store实例化放到路由守卫函数里面

import { createRouter } from 'vue-router'
const router = createRouter({// ...
})// ❌ 由于引入顺序的问题,这将失败
const store = useStore()router.beforeEach((to, from, next) => {// 我们想要在这里使用 storeif (store.isLoggedIn) next()else next('/login')
})router.beforeEach((to) => {// ✅ 这样做是可行的,因为路由器是在其被安装之后开始导航的,// 而此时 Pinia 也已经被安装。const store = useStore()if (to.meta.requiresAuth && !store.isLoggedIn) return '/login'
})

参考:
添加链接描述
pinia

2.路由报错

在这里插入图片描述

vue-router.mjs:35 [Vue Router warn]: No match found for location with path "/"
warn @ vue-router.mjs:35
显示另外 1 个框架
收起

参考:
https://blog.csdn.net/weixin_45952652/article/details/131192829

https://blog.csdn.net/m0_64344940/article/details/130710796

3.vue 样式穿透

[@vue/compiler-sfc] ::v-deep usage as a combinator has been deprecated. Use :deep(<inner-selector>) instead of ::v-deep <inner-selector>.

在这里插入图片描述
把::v-deep 替换为 :deep()
在这里插入图片描述

参考:
https://blog.csdn.net/weixin_43405300/article/details/132099608

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.rhkb.cn/news/182184.html

如若内容造成侵权/违法违规/事实不符,请联系长河编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

MySQL(9):子查询

子查询 指一个查询语句嵌套在另一个查询语句内部的查询&#xff0c;这个特性从MySQL 4.1开始引入。 SQL 中子查询的使用大大增强了 SELECT 查询的能力&#xff0c;因为很多时候查询需要从结果集中获取数据&#xff0c;或者需要从同一个表中先计算得出一个数据结果&#xff0c;…

FIddler抓手机的通讯包的设置记录

今天不知怎么滴&#xff0c;想用电脑的fiddler抓取手机的通讯过程了&#xff0c;记得原来我是会的&#xff0c;但是当时没有记录&#xff0c;所以都忘了&#xff0c;今天有空在重新来一遍&#xff0c;把过程记录一下&#xff0c;省的下次在记不住了&#xff0c;还有地方查&…

软件测试具体人员分工

最近看了点敏捷测试的东西&#xff0c;看得比较模糊。一方面是因为没有见真实的环境与流程&#xff0c;也许它跟本就没有固定的模式与流程&#xff0c;它就像告诉人们要“勇敢”“努力”。有的人在勇敢的面对生活&#xff0c;有些人在勇敢的挑战自我&#xff0c;有些人在勇敢的…

辐射骚扰整改思路及方法:辐射超标与问题定位 ?

某产品首次EMC测试时&#xff0c;辐射、静电、浪涌均失败。本篇文章就“辐射超标与问题定位”问题进行详细讨论。 一、辐射超标 50MHz 、100MHz 、130MHz 、200MHz&#xff0c;4个频点明显超标&#xff0c;其中130MHz 左右最明显&#xff0c;超出 19dB&#xff1b;后将电路板…

聊一聊关于手机Charge IC的电流流向

关于手机Charge&#xff0c;小白在以前的文章很少讲&#xff0c;一是这部分东西太多&#xff0c;过于复杂。二是总感觉写起来欠缺点什么。但后来想一想&#xff0c;本是抱着互相学习来写文章的心理态度&#xff0c;还是决定尝试写一些。 关于今天要讲的关于手机Charge的内容&a…

未来已来!2023 云栖大会龙蜥操作系统专场精彩回顾

2023 云栖大会龙蜥操作系统专场&#xff08;以下简称为“专场”&#xff09;圆满落幕。本次专场特别邀请到开放原子开源基金会理事长孙文龙和中国信息通信研究院副总工程师石友康莅临指导&#xff0c;现场聚集了阿里云、统信软件、浪潮信息、Intel、Arm、麒麟软件、蚂蚁集团、中…

智慧公厕:科技赋予公共卫生新生命,提升城市管理品质

在现代化城市中&#xff0c;公共卫生设施的发展与提升一直是对城市管理者和市民的共同期望。然而&#xff0c;传统的公共厕所常常令人困扰&#xff0c;脏乱臭成为难题。为了解决这一难题&#xff0c;广州中期科技科技有限公司全新升级的智慧公厕整体解决方案&#xff0c;补誉为…

椭圆滤波器

之前的文章 信号去噪 中列出了7种常用的信号去噪算法&#xff0c;对于后两种算法——深度学习和奇异值分解(SVD)&#xff0c;我现在也不太理解&#xff0c;就先不写了。 很多朋友留言又提了一些算法&#xff0c;今天一起来聊聊椭圆滤波器。 椭圆滤波器&#xff08;Elliptic F…

diffusers-Tasks

https://huggingface.co/docs/diffusers/using-diffusers/unconditional_image_generationhttps://huggingface.co/docs/diffusers/using-diffusers/unconditional_image_generation1.Unconditional image generation 无条件图像生成是一个相对简单的任务。模型仅生成图像&…

python基础速通

1. 梳理&#xff1a;目前学习了哪几种数据类型&#xff0c; 每一个数据类型定义一个变量&#xff0c;并输出内容以及类型 # 数据类型 # 整型 int_data 1 print(int_data, type(int_data)) # 浮点型 float_data 1.2 print((float_data, type(float_data))) # 复数 complex_da…

【LeetCode每日一题合集】2023.9.18-2023.9.24(⭐拓扑排序⭐设计数据结构:LRU缓存实现 LinkedHashMap⭐)

文章目录 337. 打家劫舍 III&#xff08;树形DP&#xff09;2560. 打家劫舍 IV&#xff08;二分查找动态规划&#xff09;LCP 06. 拿硬币&#xff08;简单贪心模拟&#xff09;2603. 收集树中金币⭐思路——拓扑排序删边 2591. 将钱分给最多的儿童&#xff08;分类讨论&#xf…

一份优秀测试用例的设计策略

日常工作中最为基础核心的内容就是设计测试用例&#xff0c;什么样的测试用例是好的测试用例?我们一般会认为数量越少、发现缺陷越多的用例就是好的用例。那么我们如何才能设计出好的测试用例呢&#xff1f;一份好的用例是设计出来的&#xff0c;是测试人员思路和方法的集合&a…

数字博物馆如何设计搭建,一文了解数字博物馆解决方案

导言&#xff1a; 数字博物馆是一种创新性的文化机构&#xff0c;通过数字技术的应用&#xff0c;将传统博物馆的宝贵文化遗产以全新的方式呈现给观众。 一.数字博物馆是什么 博物馆是指利用数字技术和互联网等新媒体技术来展示和传播文物、艺术品等文化遗产的博物馆。数字物…

康耐视VisionPro+C#程序编写

添加引用&#xff0c;用什么就添加什么 康耐视控件名 代码实现 引用命名空间 using Cognex.VisionPro.PMAlign; 实例化工具及训练区域设置 CogPMAlignTool cogPMAlignTool new CogPMAlignTool(); cogPMAlignTool.InputImage cogImageFileTool.OutputImage as CogImage8…

软件测试面试最经典的5个问题

软件测试面试灵魂五问&#xff01; 请做一下自我介绍&#xff1f;你为什么从上家公司离职&#xff1f;为什么转行做测试? 你对测试行业的认识&#xff1f;你的期望薪资是多少&#xff1f;最后&#xff0c;你要问我什么&#xff1f; 一、请做一下自我介绍 简历上有的可以一两…

分享一下怎么做小程序营销活动

小程序营销活动已经成为现代营销的必备利器&#xff0c;它能够帮助企业提高品牌知名度、促进产品销售&#xff0c;以及加强与用户的互动。然而&#xff0c;要想成功地策划和执行一个小程序营销活动&#xff0c;需要精心设计和全面规划。本文将为您介绍小程序营销活动的策划和执…

Element UI的table不同应用

目录 一、自定义表头 二、纵向表头(动态表头) 2.1、分别拿到表头和表头中日期对应的行数据 2.2、拿到每个日期对应的列数据 一、自定义表头 <el-table-column prop"chu" align"center"><!-- 自定义表头 --><template slot"header…

Apache Flink 1.12.0 on Yarn(3.1.1) 所遇到的問題

Apache Flink 1.12.0 on Yarn(3.1.1) 所遇到的問題 新搭建的FLINK集群出现的问题汇总 1.新搭建的Flink集群和Hadoop集群无法正常启动Flink任务 查看这个提交任务的日志无法发现有用的错误信息。 进一步查看yarn日志&#xff1a; 发现只有JobManager的错误日志出现了如下的…

Linux CentOS配置阿里云yum源

一&#xff1a;先备份文件&#xff0c;在配置失败时可以恢复 cd /etc/yum.repos.d mkdir back mv *.repo back 二&#xff1a;下载阿里云yum源 wget -O /etc/yum.repos.d/CentOS-Base.repo https://mirrors.aliyun.com/repo/Centos-7.repo wget -O /etc/yum.repos.d/epel.…

[SSD综述 1.4] SSD固态硬盘的架构和功能导论

依公知及经验整理,原创保护,禁止转载。 专栏 《SSD入门到精通系列》 <<<< 返回总目录 <<<< ​ 前言 机械硬盘的存储系统由于内部结构, 其IO访问性能无法进一步提高,CPU与存储器之间的性能差距逐渐扩大。以Nand Flash为存储介质的固态硬盘技术的发展,…