核心限制在于原生table.render的templet为静态渲染，每次重绘会丢失dom状态和事件绑定，导致联动失效、值不回显等问题。
layui table 单元格下拉框联动的核心限制在哪
原生 table.render 不支持单元格级的联动逻辑，因为 templet 是静态渲染的，每次重绘都会丢掉 dom 状态和事件绑定。你看到的“联动失效”“选了 a 没触发 b 刷新”“联动后值不回显”，基本都卡在这个点上。
真正起作用的不是模板本身，而是你如何在 done 回调或 tool 事件里手动接管 select 的生命周期、数据同步和重渲染时机。
用 form.on + data 属性实现两级下拉联动
适用于性别 → 职业、省份 → 城市这类固定映射关系。关键不是写多深的嵌套，而是让每个 select 都带上下文信息，方便回调时定位和更新。
- 在列定义中用
templet: '#cascadeTpl'，模板里给select加data-field="sex"和data-cascade-to="job" - 在
done回调里执行form.render('select')，否则 layui 不识别新插入的 select - 监听
form.on('select', function(data){...})，从data.elem上取dataset.cascadeTo找目标列，再用$(data.elem).closest('tr')定位当前行 - 清空并重填目标下拉框的
option，再调用form.render('select')刷新它（注意：只 render 目标 select，别全表 render）
示例片段：
<script type="text/html" id="cascadeTpl">
<select name="{{d.field}}" data-field="{{d.field}}" data-cascade-to="{{d.cascadeTo}}">
<option value="">请选择
{{# layui.each(d.data, function(i, item){ }}
<option value="{{item.value}}" {{item.value == d.value ? 'selected' : ''}}>{{item.name}}
{{# }); }}
</script>
联动时如何避免表格刷新导致输入丢失
直接调用 table.reload() 或修改 table.cache 后未同步 DOM，会导致正在编辑的 select 被销毁，用户操作中断。必须绕过整表刷新，只更新目标单元格的显示值和缓存。
- 不要改
table.cache['id']后等自动同步 —— 它不会触发单个单元格重绘 - 用
$(tr).find('[name="' + targetField + '"]')找到目标 select，.val(newVal).trigger('change') - 手动更新缓存：
var cacheRow = table.cache['id'][rowIndex]; cacheRow[targetField] = newVal; - 如果目标列也用了
templet，需重新生成 HTML 并$(td).html(newHtml)，再form.render('select')
这个步骤漏掉任意一环，就会出现“选了 A，B 下拉框变了，但点保存时还是旧值”。
第三方库如 tableEdit.js 的实际价值在哪
tableEdit.js 封装的 aopObj.on('edit.select', callback) 看似省事，但它本质仍是基于 tool 事件 + 动态插入 DOM 实现的，并未突破 layui 表格的渲染机制。它的真正优势是帮你统一管理：字段配置、校验规则、联动依赖声明（比如 "cascadeSelectField": "province"）。
但要注意两点：
- 它要求你在
cols里显式写config: { type: 'select', cascadeSelectField: 'xxx' }，没配就联动不了 - 联动数据源必须提前加载好（比如把所有省市数据一次性塞进
data），不支持按需远程拉取 —— 否则要自己 patchcallbackFn去发请求
如果你的联动需要实时查接口、带防抖、支持键盘导航，那 tableEdit.js 只能当个起点，还得自己补交互逻辑。
