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

路由菜单路径匹配方法

优化路由菜单路径匹配算法:实现获取整条线路的路径

引言

在前端开发中,路由菜单的路径匹配是一个常见的需求。我们经常需要根据给定的路径,找到对应的菜单项,并获取整条线路的路径。本文将介绍一个优化的路由菜单路径匹配算法,以实现这一功能。

问题描述

假设我们有一个路由菜单的数据结构,如下所示:

let menuList = [{path: "D", children: [{ path: "D1" },{ path: "D2", children: [{ path: "D-2-1" }]},{ path: "D3", children: [{ path: "D-3-1"}]}]},{path: "E", children: [{ path: "E1" },{ path: "E2", children: [{ path: "E-2-1" }]},{ path: "E3", children: [{ path: "E-3-1"}]}]},{path: "A", children: [{ path: "B", children: [{ path: "C"}]}]}
];

我们的目标是编写一个函数 filterAuMenu(menuList, target),该函数接受一个菜单列表 menuList 和一个目标路径 target,并返回匹配目标路径的菜单项及其所在的整条线路的路径。

算法优化

为了提高算法的效率和可读性,我们对原有的算法进行了优化。以下是优化后的代码:

export function filterAuMenu(menuList, target) {for (let item of menuList) {if (item.path === target) {return [item];}if (item.children && item.children.length > 0) {let childResult = filterAuMenu(item.children, target);if (childResult) {return [item, ...childResult];}}}return null;
}

通过递归地遍历菜单列表,我们首先检查当前菜单项的路径是否与目标路径匹配。如果匹配成功,我们返回该菜单项作为结果。
如果当前菜单项有子菜单,并且子菜单不为空,我们递归调用 filterAuMenu 函数,继续在子菜单中查找目标路径。
如果找到了匹配的路径,我们将当前菜单项与子菜单的结果合并,并返回整条线路的路径。
如果遍历完所有菜单项后仍未找到匹配的路径,我们返回 null

实现效果

通过优化后的算法,我们实现了一个能够获取整条线路路径的函数。
例如,当我们调用 filterAuMenu(menuList, “E-2-1”) 时,将返回以下结果:

[{ path: "E" },{ path: "E2" },{ path: "E-2-1" }
]

这个结果包含了目标路径 “E-2-1” 对应的菜单项以及整条线路的路径。

总结

本文介绍了一个优化的路由菜单路径匹配算法,通过递归遍历菜单列表,我们能够高效地获取整条线路的路径。这个优化后的算法在效率和可读性方面都有所提升,能够满足我们在前端开发中对路由菜单路径匹配的需求。

相关文章:

路由菜单路径匹配方法

优化路由菜单路径匹配算法:实现获取整条线路的路径 引言 在前端开发中,路由菜单的路径匹配是一个常见的需求。我们经常需要根据给定的路径,找到对应的菜单项,并获取整条线路的路径。本文将介绍一个优化的路由菜单路径匹配算法&…...

设计模式浅析(九) ·模板方法模式

设计模式浅析(九) 模板方法模式 日常叨逼叨 java设计模式浅析,如果觉得对你有帮助,记得一键三连,谢谢各位观众老爷😁😁 模板方法模式 概念 模板方法模式(Template Method Pattern)在Java中是…...

无用工作、UBI与AI

有些隐晦和黑暗的事实无法陈述,因为任何的系统中“无用”的结局都是被无情的抛弃和淘汰,AI监督下的人类结局更是如此。 什么是无用工作? 无用无效工作通常指的是那些看似忙碌但实际上对社会或个人没有实质性贡献的工作。这类工作可能包括以下…...

【监控】grafana图表使用快速上手

目录 1.前言 2.连接 3.图表 4.job和path 5.总结 1.前言 上一篇文章中,我们使用spring actuatorPrometheusgrafana实现了对一个spring boot应用的可视化监控。 【监控】Spring BootPrometheusGrafana实现可视化监控-CSDN博客 其中对grafana只是打开了一下&am…...

Django常用命令

一、新建一个新项目 django-admin startproject project_name二、新建一个app 在Django中的一个app代表一个功能模块。开发者可以将不同功能的模块放在不同的app中, 方便代码的复用。 python manage.py startapp appa_name三、数据迁移(更新数据库) 编写好了Model后&#x…...

【center-loss 中心损失函数】 原理及程序解释(更新中)

文章目录 前言问题引出open-set问题抛出 解决方法softmax函数、softmax-loss函数解决代码(center_loss.py)原理程序解释 如何梯度更新首先了解一下基本的梯度下降算法然后 前言 学习一下: 中心损失函数,用于用于深度人脸识别的特…...

什么是 HTTPS 证书?作用是什么?

HTTPS 证书,即超文本传输安全协议证书(Hypertext Transfer Protocol Secure),是网站安全的关键组成部分。它通过 SSL/TLS 加密协议,确保用户与网站之间的数据传输是加密和安全的。 什么是 HTTPS 证书? HT…...

为什么软考报名人数越来越多?

2020年软考报名人数404666人,广东省报考人数超过14万人。 ●2021年软考通信考试报名人数突破100万人,估计软考有90多万。 ●2022年软考通信考试共129万人,估计软考占了120多万人。 ●2023年软考具体报名人数没有公布,但工业和信…...

【投稿优惠|快速见刊】2024年图像,机器学习和人工智能国际会议(ICIMLAI 2024)

【投稿优惠|快速见刊】2024年图像,机器学习和人工智能国际会议(ICIMLAI 2024) 重要信息 会议官网:http://www.icimlai.com会议地址:深圳召开日期:2024.03.30截稿日期:2024.03.20 (先…...

html2canvas 将DOM节点转成图片

官网地址:html2canvas - Screenshots with JavaScript 将js文件保存到本地 可以新建一个txt文件,然后丢进去修改后缀名称即可。 在项目中引入js文件: import html2canvas from "../html2canvas.min.js" 这是我准备画的DOM节点。…...

【多线程】常见锁策略详解(面试常考题型)

目录 🌴 乐观锁 vs 悲观锁🎍重量级锁 vs 轻量级锁🍀自旋锁(Spin Lock)🎋公平锁 vs ⾮公平锁🌳可重⼊锁 vs 不可重⼊锁🎄读写锁⭕相关面试题 常⻅的锁策略 注意: 接下来讲解的锁策略不…...

Python列表操作函数

在Python中,列表(list)是一种可变的数据类型,它包含一系列有序的元素。Python提供了一系列内置的函数和方法来操作列表。以下是一些常用的Python列表操作函数和方法: 列表方法 append(x) 将元素x添加到列表的末尾。 …...

Qt注册类对象单例与单类型区别

1.实现类型SingletonTypeExample #ifndef SINGLETONTYPEEXAMPLE_H #define SINGLETONTYPEEXAMPLE_H#include <QObject>class SingletonTypeExample : public QObject {Q_OBJECT public://只能显示构造类对象explicit SingletonTypeExample(QObject *parent nullptr);//…...

Rocky Linux 运维工具yum

一、yum的简介 ​​yum​是用于在基于RPM包管理系统的包管理工具。用户可以通过 ​yum​来搜索、安装、更新和删除软件包&#xff0c;自动处理依赖关系&#xff0c;方便快捷地管理系统上的软件。 二、yum的参数说明 1、install 用于在系统的上安装一个或多个软件包 2、seach 用…...

linux下的ollama

refs: https://github.com/ollama/ollama/blob/main/docs/linux.md 1)安装 curl -fsSL https://ollama.com/install.sh | sh 2)修改服务配置&#xff0c;打开端口允许所有IP地址 refs(https://github.com/ollama/ollama/blob/main/docs/faq.md#where-are-models-stored) C…...

YOLOv9详细解读,改进提升全面分析(附YOLOv9结构图)

&#x1f951; Welcome to Aedream同学 s blog! &#x1f951; 文章目录 1. 概要1.1 模型结构上的改动:1.2 训练脚本上的改动&#xff1a; 2. 介绍2.1 背景2.2 主要贡献 3. 总体框架3.1 可编程梯度信息&#xff08;PGI&#xff09;3.1.1 辅助可逆分支3.1.2 多级辅助信息 3.2 Ge…...

html基础操练和进阶修炼宝典

文章目录 1.超链接标签2.跳锚点3.图片标签4.表格5.表格的方向属性6.子窗口7.音视频标签8.表单9.文件上传10.input属性 html修炼必经之路—各种类型标签详解加展示&#xff0c;关注点赞加收藏&#xff0c;防止迷路哦 1.超链接标签 <!DOCTYPE html> <html lang"en…...

从Mysql 数据库删除重复记录只保留其中一条(删除id最小的一条)

准备工作&#xff1a;新建表tb_coupon /*Navicat Premium Data TransferSource Server : rootlocalhostSource Server Type : MySQLSource Server Version : 50527Source Host : localhost:3306Source Schema : leyouTarget Server Type : My…...

从http到websocket

阅读本文之前&#xff0c;你最好已经做过一些websocket的简单应用 从http到websocket HTTP101HTTP 轮询、长轮询和流化其他技术1. 服务器发送事件2. SPDY3. web实时通信 互联网简史web和httpWebsocket协议1. 简介2. 初始握手3. 计算响应健值4. 消息格式5. WebSocket关闭握手 实…...

UE5 C++ Widget练习 Button 和 ProgressBar创建血条

一. 1.C创建一个继承Widget类的子类&#xff0c; 命名为MyUserWidget 2.加上Button 和 UserWidget的头文件 #include "CoreMinimal.h" #include "Components/Button.h" #include "Blueprint/UserWidget.h" #include "MyUserWidget.genera…...

S32K144外部中断实战:用按键控制LED,手把手教你避开中断标志位清除的坑

S32K144外部中断实战&#xff1a;从按键消抖到标志位管理的完整解决方案 在嵌入式开发中&#xff0c;外部中断是实现实时响应的关键机制。S32K144作为NXP面向汽车电子和工业控制的主力MCU&#xff0c;其中断系统的灵活性和可靠性备受开发者青睐。但看似简单的按键中断控制LED背…...

路由器设置必看!2.4GHz频段的隐藏信道冲突与信号增强技巧

路由器设置必看&#xff01;2.4GHz频段的隐藏信道冲突与信号增强技巧 当你坐在沙发上刷视频突然卡顿&#xff0c;或是智能家居设备频繁掉线时&#xff0c;问题可能出在那条看不见的"空中高速公路"上。2.4GHz频段就像城市的老城区道路——虽然兼容性强&#xff08;支持…...

从开环到闭环:手把手推导典型系统传递函数,彻底搞懂‘1+GH’怎么来的

从开环到闭环&#xff1a;手把手推导典型系统传递函数&#xff0c;彻底搞懂‘1GH’怎么来的 在自动控制原理的学习中&#xff0c;闭环传递函数的分母总是出现"1GH"这个神秘组合&#xff0c;这绝非偶然。本文将带您从零开始&#xff0c;通过典型闭环系统结构图&#x…...

【多模态大模型监控告警体系构建指南】:20年SRE专家亲授5大核心模块、7类典型失效场景与实时拦截SOP

第一章&#xff1a;多模态大模型监控告警体系的演进逻辑与核心范式 2026奇点智能技术大会(https://ml-summit.org) 多模态大模型在视觉理解、语音合成、跨模态检索等任务中展现出强大能力&#xff0c;但其推理路径不可见、输出不确定性高、资源消耗波动剧烈&#xff0c;传统单…...

数学建模研究者可通过爱毕业(aibiye)快速实现论文复现与自动化排版

还在为论文写作头痛&#xff1f;特别是数学建模的优秀论文复现与排版&#xff0c;时间紧、任务重&#xff0c;AI工具能帮上大忙吗&#xff1f;今天&#xff0c;我们评测10款热门AI论文写作工具&#xff0c;帮你精准筛选最适合的助手。 aibiye&#xff1a;专注于语法润色与结构…...

从理论到实践:ResNet50在图像分类任务中的部署与调优

1. ResNet50为什么成为图像分类的首选模型 我第一次接触ResNet50是在一个电商平台的商品分类项目里。当时团队尝试了VGG16、InceptionV3等多个经典模型&#xff0c;最后发现ResNet50在保持高精度的同时&#xff0c;推理速度比VGG16快3倍&#xff0c;这让我印象深刻。它的核心优…...

2026年最易被淘汰的测试角色,你中招了吗?

随着人工智能和自动化技术的飞速发展&#xff0c;软件测试行业正经历一场前所未有的变革。2026年&#xff0c;AI驱动的测试工具已从概念走向大规模落地&#xff0c;重塑了工作流程和岗位需求。Gartner数据显示&#xff0c;全球测试岗位年均萎缩率达5%&#xff0c;企业正加速部署…...

如何在机器人控制中应用惯性系与固连系转换?5个实际案例解析

如何在机器人控制中应用惯性系与固连系转换&#xff1f;5个实际案例解析 当机械臂在工厂流水线上精准抓取零件&#xff0c;或是无人机在复杂环境中自主避障时&#xff0c;其核心控制系统都在不断进行着一种"空间思维体操"——坐标系转换。这种在惯性系&#xff08;世…...

MATLAB强化学习模型打包exe实战:如何让没有MATLAB的电脑也能运行你的RL算法

MATLAB强化学习模型打包exe实战&#xff1a;跨平台部署全流程解析 当你的强化学习算法在MATLAB中调试完美后&#xff0c;如何让没有安装MATLAB的客户或边缘设备也能运行&#xff1f;这就像把一道精心烹制的大餐打包成便携餐盒——既要保留原汁原味&#xff0c;又要适应不同&quo…...

vxe-table编辑保存踩坑记录:为什么你的修改总是自动提交?(含lodash对比技巧)

vxe-table编辑保存深度解析&#xff1a;如何精准控制数据提交时机 引言 在前端开发中&#xff0c;表格组件的数据编辑功能几乎是每个中大型后台系统的标配需求。vxe-table作为一款功能强大的Vue表格组件&#xff0c;其可编辑行功能在实际业务场景中被广泛使用。然而&#xff0c…...