layui原生navbar不支持三级菜单和权限过滤，需后端返回带children的嵌套菜单数据并手写递归渲染；刷新丢失高亮须手动匹配url并向上冒泡添加layui-nav-itemed类；路径404应改用绝对路径或data参数加载数据。
layui 原生 layui.navbar() 不支持三级菜单，也不处理权限过滤 —— 动态菜单必须自己控制数据来源和渲染逻辑，不能只靠 set({ url: '...' })。
后端返回的菜单数据必须带权限标识字段
前端无法凭空判断“当前用户能不能看这个菜单”，所有权限裁剪必须在后端完成。常见错误是前端拿到全量菜单，再用 JS 过滤，这既不安全（敏感菜单可能被源码暴露），也容易漏判（比如按钮级权限未同步影响菜单显隐）。
- 后端接口（如
/api/menu）应根据登录用户的token或userId查询其角色、权限规则，递归拼出可访问的完整菜单树 - 推荐数据结构含
href、title、icon、children字段，且children必须是数组（哪怕为空），否则前端递归渲染会中断 - 不要依赖
pid/id让前端拼树 —— 易出错、难调试；后端直接返回扁平或嵌套结构均可，但嵌套更利于前端直译 - 若菜单需区分「可见但不可点」（如无权限时灰掉），建议加字段如
disabled: true或auth: false，前端渲染时加layui-disabled类
前端渲染必须绕过原生 navbar 的两级限制
layui.navbar() 的 render() 方法硬编码只遍历两级，遇到 children 里还有 children 就直接丢弃。你看到第三级菜单不显示，不是路径错，是它根本没被生成 DOM。
- 不要改
lay/modules/navbar.js—— 升级 Layui 时会被覆盖；改了也难维护 - 推荐做法：用
layui.jquery.get()拿到菜单数据后，手写递归函数生成 HTML 字符串，再$('#nav').html(html)注入 - 关键 class 不能错：
<dl class="layui-nav-child"></dl>包<dd></dd>，三级要嵌套在二级<dd></dd>内，且父级<dd></dd>需有layui-nav-itemed才能展开 - 示例片段（简化）：
function renderMenu(items) {<br> return items.map(item => ` - ` +
`${item.title}` +
(item.children && item.children.length ?
`- ${renderMenu(item.children)}
''
) +
` `
).join('');
}
刷新后菜单高亮失效？URL 匹配逻辑要自己写
Layui 不记录激活状态，layui-this 类只在 JS 初始化时加一次。页面一刷，所有状态清零。
- 别直接比
window.location.pathname和menu.href—— 前者带/开头（如/user/list），后者常为相对路径（如user/list），字符串不等就匹配失败 - 提取当前路径最后一段：用
location.pathname.split('/').filter(Boolean).pop()得到list，再逐个比对菜单href的末尾部分（如user/list→ 取list） - 三级菜单激活需向上冒泡：找到匹配项后，给它自身加
layui-this，同时给所有父级<li>加layui-nav-itemed，否则子菜单不展开 - 注意：如果菜单 href 是
#page1这类 hash 路由，得监听hashchange并重新匹配
静态资源路径 404 或 CORS 报错？别信相对路径
layui.navbar().set({ url: 'menu.json' }) 的 url 是浏览器发起的请求，路径解析基于当前页面 URL，不是服务端路径。
- 假设页面地址是
http://localhost:8080/admin/user/edit，url: 'menu.json'实际请求的是http://localhost:8080/admin/user/menu.json—— 显然 404 - 解决方法只有两个：
– 改成绝对路径，如/static/menu.json（Spring Boot 放src/main/resources/static/）
– 或彻底弃用url，改用data参数：navbar.set({ data: menuData })，数据由$.get('/api/menu')提前加载 - 本地开发用
file://协议必触发 CORS —— 必须起服务（Nginx / Spring Boot / webpack-dev-server） - 跨域时记得后端响应头加
Access-Control-Allow-Origin，且前端请求带 credentials 需设withCredentials: true
真正麻烦的不是写几行递归，而是菜单数据结构、权限裁剪边界、URL 匹配粒度这三处——它们藏在后端 SQL 和前端正则里，改一处常牵动两处，上线前务必用不同角色账号实测所有菜单路径。
