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

【vue】更改角色权限后,实现页面不刷新更改其可展示的导航菜单

登入的角色本身属于领导级别(集团权限),没有下级的不同权限:
在这里插入图片描述
切换不同身份(公司),以获得相应部门的不同导航菜单及权限
在这里插入图片描述
这里实现:更改角色权限后,实现页面 不刷新 更改其展示出来的 导航菜单

1、在右上角页面代码内,通过后端接口获取子角色(公司)的对应菜单路由(图2中data)
2、将路由数据和自身代码写入方式一样,写入store存储路由数据(参考自己代码首次获取路由后存储数据的方法)
3、通过事件总线$eventBus监听页面路由替换导航
4、清空、重新添加路由$router.addRoutes

在这里插入图片描述
导航组件里监听并操作:
在这里插入图片描述
代码片:

async toMenuChange(id) {//...省略前面非必要 此处调用自己的接口await getMenuListChange().then((mresult) => {// console.log('得到新路由列表:' , mresult);// 对数据进行改造:const sdata = JSON.parse(JSON.stringify(mresult.data)); const rdata = JSON.parse(JSON.stringify(mresult.data));const sidebarRoutes = this.filterAsyncRouter(sdata);const rewriteRoutes = this.filterAsyncRouter(rdata, false, true);rewriteRoutes.push({ path: "*", redirect: "/404", hidden: true });store.commit("SET_ROUTES", rewriteRoutes);store.commit("SET_SIDEBAR_ROUTERS",constantRoutes.concat(sidebarRoutes));store.commit("SET_DEFAULT_ROUTES", sidebarRoutes);store.commit("SET_TOPBAR_ROUTES", sidebarRoutes);// 在事件总线中发布事件 this.$bus.$emit('xxx','传递参数')this.$eventBus.$emit("changeTopBar");// 重置导航resetRouter();this.$router.addRoutes(sidebarRoutes);});
}
this.$eventBus.$on("changeTopBar", () => {// ...
});this.$eventBus.$off(["changeTopBar"]);

相关文章:

【vue】更改角色权限后,实现页面不刷新更改其可展示的导航菜单

登入的角色本身属于领导级别(集团权限),没有下级的不同权限: 切换不同身份(公司),以获得相应部门的不同导航菜单及权限 这里实现:更改角色权限后,实现页面 不刷新 更改…...

【G-LAB】网络工程师常用排错命令详细版

网络工程师在日常配置中难免出现各种配置错误,比如接口地址配错、掩码位数配错、接口忘记no shutdown。除去这些基础错误,在配置各种路由选择协议时也会因为网络类型、邻居类型、区域和路由器层级等各种问题使邻居无法建立、路由无法传递进而导致网络不通…...

Linux 桌面版关闭GUI桌面环境

持久打开和关闭 通过CtrlAltF1-F6快捷键进入命令行界面 执行以下命令,持久关闭Ubuntu桌面版的GUI环境: sudo systemctl set-default multi-user.target执行以下命令,持久开启Ubuntu桌面版的GUI环境 通过CtrlAltF7快捷键进入GUI界面 sudo s…...

ChatGPT能代替搜索引擎吗?ChatGPT和搜索引擎有什么区别?

ChatGPT和搜索引擎是两种在信息获取和交流中常用的工具,ChatGPT是一种基于人工智能技术的聊天机器人,而搜索引擎是一种在互联网上搜索信息的工具。尽管它们都是依托互联网与信息获取和交流有关,部分功能重合,但在很多方面存在着明…...

PHP海外代购管理系统mysql数据库web结构apache计算机软件工程网页wamp

一、源码特点 PHP 海外代购管理系统是一套完善的web设计系统,对理解php编程开发语言有帮助,系统具有完整的源代码和数据库,系统主要采用B/S模式开发。 代码下载 https://download.csdn.net/download/qq_41221322/88229435 论文 https://…...

游戏反外挂方案解析

近年来,游戏市场高速发展,随之而来的还有图谋利益的游戏黑产。在利益吸引下,游戏黑产扩张迅猛,已发展成具有庞大规模的产业链,市面上游戏受其侵扰的案例屡见不鲜。 据《FairGuard游戏安全2022年度报告》数据统计&…...

基于郊狼算法优化的BP神经网络(预测应用) - 附代码

基于郊狼算法优化的BP神经网络(预测应用) - 附代码 文章目录 基于郊狼算法优化的BP神经网络(预测应用) - 附代码1.数据介绍2.郊狼优化BP神经网络2.1 BP神经网络参数设置2.2 郊狼算法应用 4.测试结果:5.Matlab代码 摘要…...

【腾讯云 TDSQL-C Serverless 产品测评】全面测评TDSQL-C Mysql Serverless

全面测评TDSQL-C Mysql Serverless 文章目录 全面测评TDSQL-C Mysql Serverless前言什么是TDSQL-C Mysql Serverless初始化 TDSQL-C Mysql Serverless新建数据库建立数据表开启外网访问 兼容性SQL文件 导入导出navicat 直接在线传输 构建测试环境准备Python测试脚本准备 Jmeter…...

Qt应用开发(基础篇)——纯文本编辑窗口 QPlainTextEdit

一、前言 QPlainTextEdit类继承于QAbstractScrollArea,QAbstractScrollArea继承于QFrame,是Qt用来显示和编辑纯文本的窗口。 滚屏区域基类https://blog.csdn.net/u014491932/article/details/132245486?spm1001.2014.3001.5501框架类QFramehttps://blo…...

数据结构-->栈

💕休对故人思故国,且将新火试新茶,诗酒趁年华💕 作者:Mylvzi 文章主要内容:详解链表OJ题 前言: 前面已经学习过顺序表,链表。他们都是线性表,今天要学习的栈也是一种线…...

强训第36天

C D C 193--1100 0001 194--1100 0010 196--1100 0100 198--1100 0110 能包括全部的且最小的为 1100 0xxx xxx为主机号,站三位 B MAC地址是绑定网卡的,全球唯一 D A C D IP网段 17为网络号 所以是 40.15.1aaa aaa(7位主机号).0 因为要划分2个子网 所以…...

PyTorch bug记录

1、RuntimeError: Input type (torch.FloatTensor) and weight type (torch.cuda.FloatTensor) should be the same 这个错误是因为模型的权重是在GPU上,但是输入数据在CPU上。在PyTorch中,Tensor的类型和所在的设备(CPU或GPU)需…...

js中的正则表达式(一)

目录 1.什么是正则表达式 2.正则表达式在JavaScript中的使用场景: 3.正则表达式的语法: 1.什么是正则表达式 正则表达式(Regular Expression)是用于匹配字符串中字符组合的模式。在JavaScript中,正则表达式也是对象通常用来查找、替换那些符…...

免费开源使用的几款红黑网络流量工具,自动化的多功能网络侦查工具、超级关键词URL采集工具、Burpsuite被动扫描流量转发插件

免费开源使用的几款红黑网络流量工具,自动化的多功能网络侦查工具、超级关键词URL采集工具、Burpsuite被动扫描流量转发插件。 #################### 免责声明:工具本身并无好坏,希望大家以遵守《网络安全法》相关法律为前提来使用该工具&am…...

使用Mybatis Plus进行DAO层开发

一、特性 Mybatis应该大家现在都知道,而且在项目中都在使用,因为这块ORM框架让大家能专心业务SQL的编写,数据库的连接,连接池的使用都不用关心,极大的提高了生产效率。 今天要给大家介绍的另外一款ORM框架&#xff0…...

Android中如何不编译源生模块

如果想让自己的app 替换系统的app 比如使用闪电浏览器替换系统的Browser 首先把闪电浏览器放到 vendor/rockchip/common/apps Android.mk LOCAL_PATH : $(call my-dir) include $(CLEAR_VARS)LOCAL_MODULE : Lightning LOCAL_SRC_FILES : $(LOCAL_MODULE).apk LOCAL_MODULE_C…...

安装Vue_dev_tools

Vue控制台出现Download the Vue Devtools extension for a better development experience: 下载Vue_dev_tools,这里给出网盘链接,有Vue2和Vue3的,dev_tools 以Google浏览器为例 点击设置(就是那三个点)->扩展程序->管理扩…...

【数据结构入门指南】二叉树顺序结构: 堆及实现(全程配图,非常经典)

【数据结构入门指南】二叉树顺序结构: 堆及实现(全程配图,非常经典) 一、前言:二叉树的顺序结构二、堆的概念及结构三、堆的实现(本篇博客以实现小堆为例)3.1 准备工作3.2 初始化3.3 堆的插入3.3.1 向上调…...

css实现三角形的几种方法

css实现三角形的方法:1、使用边框实现三角形,利用透明边框和实色边框的组合,可以创建不同方向和大小的三角形;2、使用伪元素实现三角形,通过使用伪元素来创建一个占据父元素一半大小的实心三角形;3、使用tr…...

❤ Vue工作常用的一些动态数据和方法处理

❤ Vue工作常用的一些动态数据和方法处理 &#xff08;1&#xff09;动态拼接相对路径结尾的svg 错误写法一 ❌ 正确写法 &#x1f646; <img :src"require(/assets//amazon/svg/homemenu${index}.svg)" style"height: 20px;display: block;margin: 0 au…...

手游刚开服就被攻击怎么办?如何防御DDoS?

开服初期是手游最脆弱的阶段&#xff0c;极易成为DDoS攻击的目标。一旦遭遇攻击&#xff0c;可能导致服务器瘫痪、玩家流失&#xff0c;甚至造成巨大经济损失。本文为开发者提供一套简洁有效的应急与防御方案&#xff0c;帮助快速应对并构建长期防护体系。 一、遭遇攻击的紧急应…...

安宝特方案丨XRSOP人员作业标准化管理平台:AR智慧点检验收套件

在选煤厂、化工厂、钢铁厂等过程生产型企业&#xff0c;其生产设备的运行效率和非计划停机对工业制造效益有较大影响。 随着企业自动化和智能化建设的推进&#xff0c;需提前预防假检、错检、漏检&#xff0c;推动智慧生产运维系统数据的流动和现场赋能应用。同时&#xff0c;…...

苍穹外卖--缓存菜品

1.问题说明 用户端小程序展示的菜品数据都是通过查询数据库获得&#xff0c;如果用户端访问量比较大&#xff0c;数据库访问压力随之增大 2.实现思路 通过Redis来缓存菜品数据&#xff0c;减少数据库查询操作。 缓存逻辑分析&#xff1a; ①每个分类下的菜品保持一份缓存数据…...

【决胜公务员考试】求职OMG——见面课测验1

2025最新版&#xff01;&#xff01;&#xff01;6.8截至答题&#xff0c;大家注意呀&#xff01; 博主码字不易点个关注吧,祝期末顺利~~ 1.单选题(2分) 下列说法错误的是:&#xff08; B &#xff09; A.选调生属于公务员系统 B.公务员属于事业编 C.选调生有基层锻炼的要求 D…...

让AI看见世界:MCP协议与服务器的工作原理

让AI看见世界&#xff1a;MCP协议与服务器的工作原理 MCP&#xff08;Model Context Protocol&#xff09;是一种创新的通信协议&#xff0c;旨在让大型语言模型能够安全、高效地与外部资源进行交互。在AI技术快速发展的今天&#xff0c;MCP正成为连接AI与现实世界的重要桥梁。…...

算法岗面试经验分享-大模型篇

文章目录 A 基础语言模型A.1 TransformerA.2 Bert B 大语言模型结构B.1 GPTB.2 LLamaB.3 ChatGLMB.4 Qwen C 大语言模型微调C.1 Fine-tuningC.2 Adapter-tuningC.3 Prefix-tuningC.4 P-tuningC.5 LoRA A 基础语言模型 A.1 Transformer &#xff08;1&#xff09;资源 论文&a…...

AGain DB和倍数增益的关系

我在设置一款索尼CMOS芯片时&#xff0c;Again增益0db变化为6DB&#xff0c;画面的变化只有2倍DN的增益&#xff0c;比如10变为20。 这与dB和线性增益的关系以及传感器处理流程有关。以下是具体原因分析&#xff1a; 1. dB与线性增益的换算关系 6dB对应的理论线性增益应为&…...

Java编程之桥接模式

定义 桥接模式&#xff08;Bridge Pattern&#xff09;属于结构型设计模式&#xff0c;它的核心意图是将抽象部分与实现部分分离&#xff0c;使它们可以独立地变化。这种模式通过组合关系来替代继承关系&#xff0c;从而降低了抽象和实现这两个可变维度之间的耦合度。 用例子…...

淘宝扭蛋机小程序系统开发:打造互动性强的购物平台

淘宝扭蛋机小程序系统的开发&#xff0c;旨在打造一个互动性强的购物平台&#xff0c;让用户在购物的同时&#xff0c;能够享受到更多的乐趣和惊喜。 淘宝扭蛋机小程序系统拥有丰富的互动功能。用户可以通过虚拟摇杆操作扭蛋机&#xff0c;实现旋转、抽拉等动作&#xff0c;增…...

消防一体化安全管控平台:构建消防“一张图”和APP统一管理

在城市的某个角落&#xff0c;一场突如其来的火灾打破了平静。熊熊烈火迅速蔓延&#xff0c;滚滚浓烟弥漫开来&#xff0c;周围群众的生命财产安全受到严重威胁。就在这千钧一发之际&#xff0c;消防救援队伍迅速行动&#xff0c;而豪越科技消防一体化安全管控平台构建的消防“…...