在 Layui 表单提交场景中，想直接通过 layui.form.val('formFilter') 获取省市区字段值，前提是必须确保 select 位于 layui-form 容器内部、具备正确的 name 属性，并且在省市区联动切换时同步清空下级选项，同时触发 render 和 change，才能正确拿到最新数据。
只要确保三个 select 都设置了正确的 name（例如 province、city、area），并且整个表单配置了对应的 lay-filter，那么直接调用 layui.form.val('formFilter') 就可以获取到省、市、区字段的值。不要手动遍历 DOM 或自行拼接对象，否则很容易忽略联动清空后的残留脏数据，以及 checkbox、radio 等表单项的聚合处理逻辑。
为什么 data.field 里没有省市区字段？
常见原因主要有三个：
- 省市区的
select不在class="layui-form"容器内 —— 因为 Layui 表单模块只会监听这个 class 内部的表单控件 select缺少name属性，或者name命名不规范，比如前后带空格、大小写不一致（例如后端需要province_id，你却写成了provinceId）- 省市区联动时没有及时清空下级
select的value，导致表单提交时依然带着旧值，虽然界面上看不出来 —— 这不是没有获取到，而是拿到了“幽灵值”
联动后怎么确保 layui.form.val() 拿到干净数据？
每次切换上级选项时，都必须同步完成以下四个步骤：
- 使用
$('#city').empty().append('')清空旧选项并补上默认项 - 执行
$('#city').val('')，把 DOM 中的value明确设置为空字符串，而不是null或undefined - 调用
layui.form.render('select')，让 Layui 重新渲染下拉框 UI 状态 - 最后触发
$('#city').trigger('change')，否则form.val()可能无法读取到最新状态，表单验证提示也不会同步更新
后端接收时发现省市区是空字符串或 undefined
这时重点检查下面两个问题：
- 前端传递的
pid与后端返回的id类型是否完全一致 —— 如果后端返回的是字符串"110000"，那么前端过滤时就应写成item.pid === selectedProvinceId，不要写成==，也不要随意转成数字再比较 - 省市区数据是否采用平铺结构返回（这是更推荐的方式），而不是多层嵌套 JSON；嵌套结构需要前端递归解析，特别容易出现字段遗漏或层级错误，平铺数据配合
pid字段通常更稳定
真正容易让人卡住的，从来不是怎么动态拼接 option，而是 DOM、JavaScript 值以及 Layui 内部状态这三者没有保持同步。尤其是 form.render() 和 trigger('change') 这两个步骤，只要漏掉其中一个，form.val() 就很可能返回过期的省市区数据。
