Layui的element模块仅负责自动初始化和事件监听，不提供显隐控制；隐藏/显示需结合jQuery操作DOM，并同步调用form.render()、element.init()等方法确保验证和交互正常。
layui 的 element 模块本身不负责显隐控制
很多人以为 element 能直接 show/hide 标签页、折叠面板或按钮，其实不是。它只做「自动初始化」和「事件监听」——比如你写个 <div class="layui-tab">，element 会自动让它可切换；但你想让某个 tab 面板突然消失，element 不提供 hidetab() 这种方法。
真正干活的是 jQuery（Layui 内置的 $）或者原生 DOM 操作。
-
element模块加载后，element.tabChange()只能切换激活项，不能隐藏整个 tab 容器 - 要隐藏一个 tab 面板？得用
$("#tab-panel-id").hide()，再配合form.render()（如果里面含表单元素） - 隐藏后若需恢复交互（比如重新点击触发），注意别漏掉
element.init()或手动重绑事件
动态显示/隐藏表单模块：必须同步 lay-verify 和 form.render()
单纯 .show()/.hide() 表单区域，会导致验证失效或校验丢失——因为 Layui 表单验证依赖 lay-verify 属性，而隐藏时没清理它，显示时又没恢复它。
正确做法是：隐藏时把 lay-verify 值暂存到 data-required，移除属性；显示时取回并设回去，最后调 form.render()。
- 不执行
form.render()→ 新显示的输入框无法被验证，提交时被跳过 - 不保存/恢复
lay-verify→ 隐藏后再显示，字段可能变成“非必填”或校验规则错乱 - 示例关键行：
$module.find("[lay-verify]").each(function() { $(this).attr("data-required", $(this).attr("lay-verify")); $(this).removeAttr("lay-verify"); });
表格列的动态隐藏：分清 hide: true 和运行时 DOM 操作
静态隐藏用配置项 hide: true，性能好、一次到位；动态切换必须走 jQuery，但要注意时机和副作用。
-
hide: true在cols里写死 → 列完全不渲染，DOM 里没有，适合 ID、日志等纯后台字段 - 运行时用
$("[data-field='xxx']").hide()→ 列还在 DOM 中，只是不可见；后续若要恢复，得.show()，但表格宽度可能错乱 - 表格重绘后（如排序、分页），手动隐藏的列可能被重置 → 建议在
done回调里再次执行隐藏逻辑 - 不要对
th或td单独 hide/show，应统一操作带data-field的整列容器
下拉联动导致区域显隐：别只改 display，记得触发表单重渲染
根据 select 的 lay-filter 切换 div 显隐很常见，但容易忽略两个细节：一是隐藏区域里的表单控件（如 textarea、select）可能未初始化，二是 form.verify() 不会自动识别新显示的字段。
- 首次显示富文本编辑器（如
layedit）或级联下拉框时，需手动调layedit.build()或form.render('select') - 如果隐藏区里有
lay-verify字段，显示后不form.render()→ 提交时该字段不参与校验 - 避免用
v-if（那是 Vue 的）——Layui 环境里纯靠.show()/.hide()+ 手动补渲染
