React hooks动态配置侧边栏

news2024/12/26 11:57:00

React hooks根据不同需求 还有不同的角色 动态的去配置侧边栏

需求:
点击某个按钮是一套侧边栏 ,不同角色(比如管理员之类的权限高一点)比普通用户多个侧边栏


然后点击另一个按钮是另一套侧边栏

此时,就需要动态的去配置侧边栏了

我这里就不详细的配置路由和路由跳转了 只展示一下配置不同侧边栏的方法和代码

侧边栏:

自己定一个类型,然后就将对应的侧边栏传进去


这样就实现了两套不同侧边栏

然后是侧边栏不同角色显示

如下:


完毕!

现在是下午5.21 今天又是一年高考 好像离我很远很远啦 上班后就太太太羡慕有暑假的小孩啦
高考加油阿 我一个小时后就放端午假啦 考不好的话就要像我一样上班敲代码啦

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

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

安装 JDK 8

安装包 百度网盘 提取码:6666 安装步骤 安装路径不要有中文或者特殊符号如空格等。 双击安装包开始安装。 更改安装路径: 跳出一个页面,安装公共 JRE: 配置环境变量: 配置成功: 去掉自动更新

【教程】从0开始搭建大语言模型:Word和位置Embedding

从0开始搭建大语言模型:Dataset构造 接上文:【教程】从0开始搭建大语言模型:文本预处理 通过滑动窗口进行数据采样 我们要构造输入-目标对来对模型进行训练。 在LLM中,它通过预测文本中的下一个单词进行训练,如下所…

C#操作MySQL从入门到精通(9)——Mysql中的数据类型以及对应的C#中的数据类型

前言 本文介绍Mysql中的数据类型以及每种类型对应的c#中的数据类型 1、整数 bit int tinyint smallint mediumint bigint 2、浮点数 float double decimal 3、日期时间 year time date datetime timestamp 4、字符型 char varchar tinytext text mediumtext longtext …

如何开发一 VSCode 插件

如何开发一个 VSCode 插件,本文开发一个 VSCode “Hello World” 插件,通过代码了解 VSCode 插件是如何工作的。 安装脚手架 npx --package yo --package generator-code -- yo code根据提示选择,插件开发语言选择 TypeScript ? What type…

原力、百度、人人文档下载工具

只可下载可预览的文档,格式为pdf,不能完全保证下载成功,X度与我们既是对手也是朋友。 本文的软件来自的大神,仅供学习交流,不可做它用。 向的大神致敬!!!

信息系统项目管理师0148:输出(9项目范围管理—9.3规划范围管理—9.3.3输出)

点击查看专栏目录 文章目录 9.3.3 输出 9.3.3 输出 范围管理计划 范围管理计划是项目管理计划的组成部分,描述将如何定义、制定、监督、控制和确认项 目范围。范围管理计划用于指导如下过程和相关工作: ①制定项目范围说明书;②根据详细项目范…

在npm发布自己的组件包

目录 前言 正文 npm和git的对比 Node环境的配置 具体发布步骤 ※※需要注意的是 尾声 🔭 Hi,I’m Pleasure1234🌱 I’m currently learning Vue.js,SpringBoot,Computer Security and so on.👯 I’m studying in University of Nottingham Ni…

信息系统项目管理师0149:输入(9项目范围管理—9.4收集需求—9.4.1输入)

点击查看专栏目录 文章目录 9.4 收集需求9.4.1 输入9.4 收集需求 收集需求是为实现目标而确定,记录并管理干系人的需要和需求的过程。本过程的主要作用是为定义产品范围和项目范围奠定基础。本过程仅开展一次或仅在项目的预定义点开展。收集需求过程的数据流向如图 9-2 所示。…

力扣 74.搜索二维矩阵

题目描述: 给你一个满足下述两条属性的 m x n 整数矩阵: 每行中的整数从左到右按非严格递增顺序排列。每行的第一个整数大于前一行的最后一个整数。 给你一个整数 target ,如果 target 在矩阵中,返回 true ;否则&am…

【MMU】——ARM 二级页表

文章目录 二级页表项即 entry 的格式如下 二级页表项有三种类型 产生中止异常的故障条目。这可能是预取或数据中止、取决于访问类型。这实际上表示虚拟地址未映射 bit[1:0] 00大页 64KB。bit[1:0] 01。小页 4KB。bit[1:0]1x。 一级页表占用 16KB 的内存,二级页表…

攻防世界---misc---Hear-with-your-Eyes

1、题目描述,下载附件,是一个.gz后缀的文件,查找资料发现,这个后缀是Linux系统的压缩包后缀。这里题目提示了用眼睛听音频,说明会有个音频,并且信息就在音频,可以用眼睛看到 2、将文件放在linux…

警务反诈RPA:利用机器人流程自动化技术打击诈骗行为

信息时代,网络技术快速发展,在丰富生活的同时,也带来了持续高发的电信网络诈骗问题,对社会造成了严重威胁。面对海量的数据信息,传统数据融合技术的瓶颈不断显现,无法满足风险防控、打击诈骗的效率要求&…

使用 Spring Boot 开发邮件系统

文章目录 使用 Spring Boot 开发邮件系统邮件发送流程简单使用第 1 步:pom 包配置第 2 步:配置文件163 邮箱配置126 邮箱配置QQ 邮箱配置如下:开启 POP 3 / SMTP 服务、IMAP / SMTP 服务开通设置客户端授权密码 第 3 步:文本邮件发送第 4 步&…

L45---506.相对名次(java)--排序

1.题目描述 2.知识点 (1)String.join(" ", words) 是 Java 中的一个语法,用于将数组或集合中的元素连接成一个单独的字符串,连接时使用指定的分隔符。这里的 " " 是作为分隔符使用的一个空格字符串。 Strin…

Bond 网卡绑定技术学习

前言: 为了实现网卡的高可用性,需要学习一下 Bond技术 1. 概念 Bond(也被称为链路聚合、端口绑定或接口绑定)是一种网络技术,用于将多个物理网络接口(如以太网接口)组合成一个逻辑接口。这样做…

循环语句大揭秘:while、do-while、for、foreach你都掌握了吗?

哈喽,各位小伙伴们,你们好呀,我是喵手。运营社区:C站/掘金/腾讯云;欢迎大家常来逛逛 今天我要给大家分享一些自己日常学习到的一些知识点,并以文字的形式跟大家一起交流,互相学习,一…

高质量 HarmonyOS 权限管控流程

高质量 HarmonyOS 权限管控流程 在 HarmonyOS 应用开发过程中,往往会涉及到敏感数据和硬件资源的调动和访问,而这部分的调用就会涉及到管控这部分的知识和内容了。我们需要对它有所了解,才可以在应用开发中提高效率和避免踩坑。 权限管控了…

STM32项目分享:智能门禁锁系统

目录 一、前言 二、项目简介 1.功能详解 2.主要器件 三、原理图设计 四、PCB硬件设计 1.PCB图 2.PCB板及元器件图 五、程序设计 六、实验效果 七、资料内容 项目分享 一、前言 项目成品图片: 哔哩哔哩视频链接: https://www.bilibili.c…

使用 stress 命令进行Linux CPU 压力测试

大家好,在现代计算机系统中,对系统性能和稳定性的评估是至关重要的。特别是在服务器环境中,我们需要确保系统能够在高负载情况下稳定运行,以满足用户的需求。而 CPU 是系统中最关键的组件之一,其性能直接影响着整个系统…

探索加密货币:打造Web3项目与企业的新篇章

本文来源香港Web3媒体:Techub News 在数字化浪潮席卷全球的今天,加密货币及Web3项目和企业正成为引领创新的重要力量。作为这一领域的观察者,Mark Beylin深入剖析了如何通过打造人们真正需要的代币,来推动Web3项目的成功与企业的蓬…