Layui不处理多标签页控制，因其仅为UI框架，无跨标签页会话管理能力；需在Vue入口用Cookie+sessionStorage双校验实现同域名单活跃标签页限制。
做不到真正禁止，但可以用 Cookie + sessionStorage 组合实现「同域名下只允许一个活跃标签页」的效果——用户再开第二个标签页访问同一地址时，会直接拦截并提示“请勿重复打开”。关键不在 Layui，而在页面入口的守门逻辑。
为什么 Layui 本身不处理这个需求
Layui 是 UI 框架，不介入浏览器多标签页的会话管理。它没提供 tab、window 或 session 级别的跨标签页控制能力。所有“禁止多开”的逻辑必须写在 Vue/HTML 入口或 JS 主流程里，和 Layui 渲染的表单、弹窗、表格无关。
sessionStorage + Cookie 双校验是唯一可靠路径
利用两者特性差异：
sessionStorage 是单标签页独占，关掉就消失；
Cookie 是同域名共享，所有标签页都能读写。
组合起来就能判断：“有没有其他标签页正在活跃”。
- 首次打开：查
sessionStorage.getItem('allow-page-opened')→ 不存在 → 再查Cookie里的最后活跃时间戳 → 若距今 >2000ms，视为无活跃会话，允许打开 - 允许打开后：立即写入
sessionStorage.setItem('allow-page-opened', '1')，并启动定时器每秒更新Cookie中的时间戳 - 页面卸载前（
beforeunload或unload）：清除Cookie时间戳，避免假死态残留
注意：不能只靠 sessionStorage 判断，否则刷新页面就会被误拦；也不能只靠 Cookie，否则关掉所有标签页后新打开仍会被拒（因为时间戳没清）。
Vue 项目中怎么接入（以 main.ts 为例）
把守门逻辑放在 createApp 之前，而不是等 Layui 初始化之后：
import { createApp } from "vue";
import App from "./App.vue";
import { allowOpenPage } from "./access-utils";
if (allowOpenPage()) {
createApp(App).mount("#app");
} else {
createApp({ template: `<h1>请勿重复打开标签页</h1>` }).mount("#app");
}
其中 allowOpenPage() 就是封装好的双校验函数。它不依赖任何框架，纯 JS 实现，和 Layui 完全解耦。
⚠️ 容易被忽略的点：
Vite 默认用 Vue 运行时版（vue.runtime.esm-bundler.js），不支持字符串模板（如上面的 template: '<h1>...</h1>'）。必须在 vite.config.ts 中显式 alias 到完整版：'vue': 'vue/dist/vue.esm-bundler.js'，否则会白屏且无报错。
