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

vue-element-plus-admin框架的tag上下文切换bug

问题

首先贴上该框架的链接:https://github.com/kailong321200875/vue-element-plus-admin

在对路由进行部分修改后,网站多次切换tag时,控制台会出现报错:Cannot read properties of undefined (reading 'offsetLeft')
我在框架的issue中找到了类似问题:打开多个TagsView时会报错,用的 template 分支

对此,作者给出的回答是,template分支不再维护,因此并没有给出该问题的解决方案。

解决方法:

在项目src\components\TagsView\src\TagsView.vue 文件中,项目使用了tagLinksRefs变量获取了tag标签路由的ref,之后对该变量进行了获取值等一系列操作。

 <router-link :ref="tagLinksRefs.set" :to="{ ...item }" custom v-slot="{ navigate }">

问题就出在ref得到的变量中,数组里的路由一直在增加,导致后面出现一系列错误(错误原因未知)。
我的解决方法页很粗暴,不使用router-linkref变量,而是从自己维护的路由数组item 中得到tag的一系列信息。

相关文章:

vue-element-plus-admin框架的tag上下文切换bug

问题 首先贴上该框架的链接&#xff1a;https://github.com/kailong321200875/vue-element-plus-admin 在对路由进行部分修改后&#xff0c;网站多次切换tag时&#xff0c;控制台会出现报错&#xff1a;Cannot read properties of undefined (reading offsetLeft)。 我在框架…...

vue中,父子组件传递参数 props 实现方式

通过 Prop 向子组件传递数据 001&#xff1a;父组件》子组件通信 <template><div><h1>这里是父元素</h1>//******<childComponent :detailMes"detailMes"/></div> </template><script>import childComponent from…...

Unity如何快速接入iOS和GooglePlay的成就排行榜等GameCenter功能

一般在游戏开发中&#xff0c;经常有成就排行榜的需求&#xff0c;按照我们的理解&#xff0c;通常是要自己导入谷歌的sdk&#xff0c;或者苹果的sdk&#xff0c;然后封装后通过桥接来调用。 不用这么复杂&#xff0c;本鱼蛋(egostudio 防爬)告诉大家一个方法&#xff0c;其实…...

Unity下如何实现低延迟的全景RTMP|RTSP流渲染

技术背景 Unity3D可以用于创建各种类型的的应用程序&#xff0c;包括虚拟现实、培训模拟器等。以下是一些可以使用Unity3D全景播放的场景&#xff1a; 虚拟现实体验&#xff1a;全景视频可以用来创建逼真的虚拟环境&#xff0c;使用户能够感受到身临其境的感觉&#xff1b;培…...

STM32 USB使用记录:HID类设备(后篇)

文章目录 目的基础说明项目构建与代码调整接收发送代码与测试示例链接报告描述符总结 目的 接上篇&#xff1a; 《STM32 USB使用记录&#xff1a;HID类设备&#xff08;前篇&#xff09;》 USB HID 类的设备有个比较大的好处是大部分时候接入主机中都是可以免驱使用的。这篇文…...

C# 快速写入日志 不卡线程 生产者 消费者模式

有这样一种场景需求&#xff0c;就是某个方法&#xff0c;对耗时要求很高&#xff0c;但是又要记录日志到数据库便于分析&#xff0c;由于访问数据库基本都要几十毫秒&#xff0c;可在方法里写入BlockingCollection&#xff0c;由另外的线程写入数据库。 可以看到&#xff0c;在…...

Pandas将对角线元素设为1

Pandas将对角线元素设为1 提示&#xff1a;这里可以添加系列文章的所有文章的目录&#xff0c;目录需要自己手动添加 例如&#xff1a;第一章 Python 入门之pandas的使用 提示&#xff1a;np.fill_diagonal(df.values, 1)的用法 Pandas将对角线元素设为1 Pandas将对角线元素设为…...

WPF实战学习笔记28-登录界面

添加登录界面UI 添加文件loginview.xaml。注意本界面使用的是md内的图标。没有登录界面的图片 <UserControlx:Class"Mytodo.Views.LoginView"xmlns"http://schemas.microsoft.com/winfx/2006/xaml/presentation"xmlns:x"http://schemas.microsof…...

01背包

动态规划解题步骤: 动态规划问题&#xff0c;一般从三个步骤进行考虑。 步骤一&#xff1a;集合及集合的状态。 所谓的集合&#xff0c;就是一些方案的集合。 用 g[i][j] 表示从前 i 种物品中进行选择&#xff0c;且总体积不大于 j 的各个选法获得的价值的集合。注意&#…...

064、故障处理之OMM_TiDB

oom 内存溢出&#xff0c;内存泄漏&#xff0c;相当于TiDB不能用了 TiDB Server OOM对业务的影响 TiDB Server上的业务SQL会失败业务响应时间升高前端体验变差 诊断方法 客户端应用 ERROR 2013(HY000): Lost connection to MySQL Server during query日志 dmesg -T | gr…...

网络设备中的配置文件管理

建立强大网络的第一步是为灾难和网络中断做好准备&#xff0c;许多企业在中断期间遭受损失&#xff0c;因为他们缺乏备份计划并且配置管理不达标&#xff0c;使用配置文件管理工具进行适当的配置文件管理不仅有助于处理网络中断&#xff0c;还有助于优化网络性能。 使用配置文…...

HCIP BGP综合实验

题目 1、AS1存在两个环回&#xff0c;一个地址为192.168.1.0/24该地址不能在任何协议中宣告&#xff1b; 2、AS3中存在两个环回&#xff0c;一个地址为192.168.2.0/24该地址不能在任何协议中宣告&#xff0c;最终要求这两个环回可以互相通讯&#xff1b; 3、AS间的骨干链路I…...

【mysql学习篇】Order by与Group by优化以及排序算法详解

一、Order by与Group by优化 Case1&#xff1a; 分析&#xff1a; 利用最左前缀法则&#xff1a;中间字段不能断&#xff0c;因此查询用到了name索引&#xff0c;从key_len74也能看出&#xff0c;age索引列用在排序过程中&#xff0c;因为Extra字段里没有using filesort 注意…...

【业务功能篇60】Springboot + Spring Security 权限管理 【终篇】

4.4.7 权限校验扩展 4.4.7.1 PreAuthorize注解中的其他方法 hasAuthority&#xff1a;检查调用者是否具有指定的权限&#xff1b; RequestMapping("/hello")PreAuthorize("hasAuthority(system:user:list)")public String hello(){return "hello Sp…...

文章详情页 - 评论功能的实现

目录 1. 准备工作 1.1 创建评论表 1.2 创建评论实体类 1.3 创建 mapper 层评论接口和对应的 xml 实现 1.4 准备评论的 service 层 1.5 准备评论的 controller 层 2. 总的初始化详情页 2.1 加载评论列表 2.1.1 实现前端代码 2.1.2 实现后端代码 2.2 查询当前登录用户的…...

使用贝叶斯滤波器通过运动模型和嘈杂的墙壁传感器定位机器人研究(Matlab代码实现)

&#x1f4a5;&#x1f4a5;&#x1f49e;&#x1f49e;欢迎来到本博客❤️❤️&#x1f4a5;&#x1f4a5; &#x1f3c6;博主优势&#xff1a;&#x1f31e;&#x1f31e;&#x1f31e;博客内容尽量做到思维缜密&#xff0c;逻辑清晰&#xff0c;为了方便读者。 ⛳️座右铭&a…...

Day 69-70:矩阵分解

代码&#xff1a; package dl;import java.io.*; import java.util.Random;/** Matrix factorization for recommender systems.*/public class MatrixFactorization {/*** Used to generate random numbers.*/Random rand new Random();/*** Number of users.*/int numUsers…...

数据结构:树的存储结构

学习树之前&#xff0c;我们已经了解了二叉树的顺序存储和链式存储&#xff0c;哪么我们如何来存储普通型的树结构的数据&#xff1f;如下图1&#xff1a; 如图1所示&#xff0c;这是一颗普通的树&#xff0c;我们要如何来存储呢&#xff1f;通常&#xff0c;存储这种树结构的数…...

Vue前端渲染blob二进制对象图片的方法

近期做开发&#xff0c;联调接口。接口返回的是一张图片&#xff0c;是对二进制图片处理并渲染&#xff0c;特此记录一下。 本文章是转载文章&#xff0c;原文章&#xff1a;Vue前端处理blob二进制对象图片的方法 接口response是下图 显然&#xff0c;获取到的是一堆乱码&…...

Java的标记接口(Marker Interface)

Java中的标记接口&#xff08;Marker Interface&#xff09;是一个空接口&#xff0c;接口内什么也没有定义。它标识了一种能力&#xff0c;标识继承自该接口的接口、实现了此接口的类具有某种能力。 例如&#xff0c;jdk的com.sun.org.apache.xalan.internal.xsltc.trax.Temp…...

千问3.5-9B Visio图表智能生成:从文本描述到专业架构图

千问3.5-9B Visio图表智能生成&#xff1a;从文本描述到专业架构图 1. 效果惊艳的智能图表生成 想象一下&#xff0c;你只需要用简单的文字描述系统架构&#xff0c;就能在几分钟内获得专业的Visio图表。千问3.5-9B让这个场景成为现实。这个模型不仅能理解复杂的系统架构描述…...

3步搞定飞书文档批量导出:告别手动复制粘贴的终极解决方案

3步搞定飞书文档批量导出&#xff1a;告别手动复制粘贴的终极解决方案 【免费下载链接】feishu-doc-export 飞书文档导出服务 项目地址: https://gitcode.com/gh_mirrors/fe/feishu-doc-export 还在为飞书文档的迁移备份而烦恼吗&#xff1f;每次需要导出几十上百个文档…...

Linux 命令mkdir详细教程

Linuxmkdir命令详细教程一、mkdir命令的基本功能mkdir&#xff08;Make Directory&#xff09;是 Linux 系统中用于创建新目录&#xff08;文件夹&#xff09;的基础命令。它支持一次性创建单个或多个目录&#xff0c;以及递归创建多层目录结构&#xff0c;是文件系统操作中最常…...

AI绘画工作流:OpenClaw调度千问3.5-35B-A3B-FP8生成SD提示词

AI绘画工作流&#xff1a;OpenClaw调度千问3.5-35B-A3B-FP8生成SD提示词 1. 为什么需要自动化提示词生成 在Stable Diffusion创作中&#xff0c;最耗时的环节往往不是渲染过程&#xff0c;而是反复调试提示词&#xff08;prompt&#xff09;。我曾在一次商业插画项目中&#…...

comsol复合相变墙体保温隔热,comsol论文复现建模仿真 模拟室外温度变化复合墙体温度变化过程

comsol复合相变墙体保温隔热&#xff0c;comsol论文复现建模仿真 模拟室外温度变化复合墙体温度变化过程&#xff0c;对比普通墙体的保温隔热性能大夏天顶着40度高温站阳台收衣服的时候&#xff0c;总想着要是墙体能像冰柜门一样隔热该多好。最近用COMSOL折腾了个复合相变墙体模…...

计算机毕业设计springboot展会门票系统 基于SpringBoot的会展票务数字化服务平台 SpringBoot框架下的博览会入场券预约与核销系统

计算机毕业设计springboot展会门票系统 &#xff08;配套有源码 程序 mysql数据库 论文&#xff09; 本套源码可以在文本联xi,先看具体系统功能演示视频领取&#xff0c;可分享源码参考。随着会展经济的蓬勃发展和数字化转型的深入推进&#xff0c;各类展会活动规模不断扩大&am…...

系统整体设计方案

业务架构设计项目架构图业务流程设计文档向量整个流程从用户上传文档开始&#xff0c;用户通过前端页面选择文档并设置相关的组织标签和可见信后系统开始接收文档。这个阶段的关键是建立文档的基本记录信息&#xff0c;包括文件的Md5哈希值文件原始名文件大小上传用户等信息。系…...

Graphormer在药物发现中的价值:缩短先导化合物筛选周期50%以上

Graphormer在药物发现中的价值&#xff1a;缩短先导化合物筛选周期50%以上 1. 引言&#xff1a;药物研发的新利器 在药物研发领域&#xff0c;科学家们每年需要筛选数百万种化合物来寻找潜在的药物候选分子。传统方法不仅耗时耗力&#xff0c;而且成本高昂。Graphormer的出现…...

Python量化交易系统:专业回测与组合优化

先把最重要的前提说清楚&#xff1a;国内禁止未经许可的程序化自动交易&#xff0c;下面只做量化研究、回测、信号分析&#xff0c;不含实盘自动下单这套是专业完整版量化系统&#xff0c;Python 可直接运行&#xff0c;结构完整、可扩展包含你要的所有高级功能&#xff1a;多股…...

建筑混凝土搅拌机的设计【任务书、带solidworks三维、7张cad图纸、毕业论文、开题报告、答辩稿】

建筑混凝土搅拌机作为现代建筑施工的核心设备&#xff0c;其设计需兼顾效率、可靠性与适应性。任务书明确了设计目标&#xff1a;通过优化搅拌机构、传动系统及整体结构&#xff0c;实现混凝土均匀性提升与能耗降低&#xff0c;同时确保设备在复杂工况下的稳定性。这一目标贯穿…...