优雅注销需同步清理四大类状态：认证凭证与会话数据、路由与权限状态、表单与组件UI状态、弹层与动态资源；必须执行layer.closeAll()、清空localStorage关键项、重置权限缓存、重置表单与表格缓存，最后跳转登录页。
点击注销时，要真正“优雅清除所有状态”，核心不是删 token 就完事，而是同步清理前端各模块残留的上下文、缓存、UI 和生命周期资源。Layui 后台模板（如 AdminPro 或官方 LayuiAdmin）依赖多个模块协同工作，单点清除容易遗漏，导致下次登录异常、页面卡顿或权限错乱。
必须清除的四大类状态
不按顺序或漏掉任意一类，都可能引发后续问题：
-
认证凭证与会话数据：包括
localStorage中的access_token、refresh_token、用户信息（如userInfo）、菜单缓存（menuList）等； -
路由与权限状态：LayuiAdmin 的拦截器依赖
setter.request.tokenName和admin.hasPermission()内部缓存，不清除会导致跳转后仍显示旧菜单或拦截失效； -
表单与组件 UI 状态：全局表单（如顶部搜索、侧边栏表单）、表格勾选（
table.checkStatus()缓存）、穿梭框/下拉框选中态、开关（switch）值等，若不清除，重新进入页面时 UI 与实际数据不一致； -
弹层与动态资源：所有已打开的 layer 弹窗（含 iframe 类型）、定时器、事件监听器（如
document.onkeydown）、Vue 实例（若集成）等，残留将造成内存泄漏或重复触发。
推荐的注销执行流程（一行都不能少）
把以下逻辑封装为 admin.logout() 方法，在注销按钮点击事件中调用：
- 先调用
layer.closeAll()关闭所有弹层，避免子页残留； - 遍历并清空关键 storage 项：
localStorage.removeItem('access_token')、localStorage.removeItem('userInfo')、localStorage.removeItem('menuList')； - 重置权限缓存：
admin.clearPermissions?.()（若存在）或手动清空admin.permissions = {}； - 重置所有已渲染表单：
form.val(null, {})+form.render()，再单独处理 select/checkbox：form.render('select')、form.render('checkbox')； - 清除表格勾选缓存：
table.clearCache('userTable')（逐个 ID 调用，或遍历layui.table.cache对象键名）； - 最后跳转登录页：
location.href = '/login.html'（不要用location.reload()，防止旧 token 被重读）。
特别注意 iframe 弹层和子页清理
若系统大量使用 type: 2 iframe 弹窗（如编辑弹窗），仅父页清除不够：
- 在子页（如
/edit.html）全局暴露销毁函数：window.onDestroy = () => { sessionStorage.clear(); }； - 父页注销流程中，主动查找所有 iframe 并尝试调用：
$(‘iframe’).each((i, el) => { try { el.contentWindow.onDestroy?.(); } catch(e){} });； - 加
try/catch是必须的——跨域 iframe 会报错，未定义onDestroy也会中断流程。
避免常见“假清除”陷阱
这些操作看似清了，实则无效或埋雷：
- 只删
access_token却不删userInfo：下次登录前若调用admin.getUser()，仍会返回旧用户头像/昵称； - 用
form.reset()替代form.val()：对 select、date、switch 等 layui 封装组件完全无效； - 调用
table.reload({data: []})当作清状态：它不清缓存、不重置勾选、不销毁编辑态，纯属刷新数据； - 在
cancel回调里清状态：该回调只响应右上角 ×，不覆盖 Esc、遮罩点击、layer.close()等关闭方式，不可靠。
