layui.table右键事件需绕过事件代理，在done回调中对真实DOM绑定contextmenu并preventDefault；第三方contextMenu插件需正确注册路径、引入CSS，避免同时use加载；取行数据推荐templet注入data-row；菜单需手动销毁再初始化，固定列场景须分别计算坐标。
layui.table 绑定右键事件时 event.preventDefault() 失效？
因为 layui 的表格默认启用了原生右键菜单拦截（比如复制单元格内容），直接在 table.on('row') 里监听 contextmenu 会失败，事件被 table 内部的 oncontextmenu 阻止了。必须绕过 layui 的事件代理层，从 dom 节点本身下手。
- 不要用
table.on('row(test)', ...)去监听右键，它只响应左键点击 - 要在表格渲染完成后，用
document.querySelector('.layui-table')拿到真实 DOM，再绑定contextmenu - 记得在
done回调里操作，否则 DOM 还没生成，查不到节点 - 绑定后一定要
event.preventDefault()，否则浏览器默认菜单仍会弹出
用 layui.use('contextMenu') 插件时菜单不显示？
官方没提供 contextMenu 插件，所谓“通过插件”通常指社区第三方模块（如 layui-contextmenu），但它和 layui 2.8+ 的模块加载机制有兼容问题：模块未正确注册、CSS 未引入、或 layui.cache 缓存导致 JS 加载顺序错乱。
- 确认插件 JS 已通过
layui.config({ paths: { 'contextMenu': '/path/to/contextMenu' } })注册路径 - 检查是否漏了插件配套的 CSS，没有样式会导致菜单
display: none或宽高为 0 - 避免在
layui.use(['table', 'contextMenu'], ...)中同时加载，改为先use('table')渲染完，再动态layui.addcss+layui.loader引入 contextMenu - 右键坐标计算依赖
event.clientX / clientY，若表格在滚动容器内，需手动减去容器scrollTop/scrollLeft
右键菜单项怎么关联当前行数据？
layui 表格的 tr 元素上挂了 data-index 属性，但这个值是渲染序号，不是原始数据索引；直接取 $(tr).data('index') 容易错位，尤其开启分页或搜索后。
- 推荐在
table.render()的cols中给某列加templet，把整行数据序列化进data-row属性：templet: '<div data-row="{{ JSON.stringify(d) }}">{{d.name}}</div>' - 右键触发时，用
$(e.target).closest('tr').find('[data-row]').data('row')取原始对象 - 如果不想改模板，可用
table.cache['test']+$(e.target).closest('tr').data('index')查缓存数组，但注意该索引是当前页内序号，要换算成全局索引
菜单点击后如何关闭并执行业务逻辑？
第三方 contextMenu 插件大多靠 click 事件触发菜单项，但点击后菜单不会自动销毁，重复右键可能叠加多个实例，内存泄漏风险明显。
- 每次右键前先调用插件的销毁方法（如
contextMenu.destroy()），再重新初始化 - 菜单项
click回调里，除了业务代码，必须显式调用contextMenu.hide()或移除.layui-context-menu节点 - 别在菜单项里直接调用
table.reload()，它会重绘整个表格，导致右键菜单 DOM 被清空却未隐藏，出现“看不见但点得着”的幽灵菜单 - 复杂操作建议加个
setTimeout(() => { contextMenu.hide() }, 100)，确保 DOM 更新完成后再收起
最麻烦的其实是表格固定列（fixed: 'left'）场景：右键位置计算要分别处理主表体和固定列两个容器，稍不注意菜单就偏移到屏幕外。这个点很少被文档提到，但上线后必踩。
