Layui中radio动态控制input必填需监听radio变化→修改lay-verify属性→调用form.render('input')重载；必须确保input有name属性，不可用原生required，隐藏域需设type="text"并隐藏；自定义验证不适用此场景。
radio 选中后让某个 input 变成必填项
直接靠 lay-verify="required" 不行——layui 表单初始化时就锁定了验证规则，后续动态增删或开关校验都得手动干预。核心思路是：监听 radio 变化 → 修改目标 input 的 lay-verify 属性 → 调用 form.render('input') 重载该类元素。
常见错误现象：input 的 lay-verify 值改了，但提交时仍不校验；或者提示“未填写”，实际已输入内容。
- 必须确保目标
input初始状态有name属性（Layui 验证只认name，不看id或其他） - 不要用 JS 直接改
required原生属性（input.required = true），Layui 完全不读它 - 修改完
lay-verify后，一定要调用form.render('input')，否则 DOM 更新了但 Layui 内部缓存没刷新 - 如果目标
input是隐藏域（type="hidden"），Layui 默认跳过校验，得换成type="text"并加style="display:none"
监听 radio 并触发 input 校验开关的完整写法
以「是否启用 VIP」控制「VIP 折扣率」是否必填为例：
<input type="radio" name="is_vip_open" value="1" title="是"><input type="radio" name="is_vip_open" value="0" title="否" checked><div class="layui-form-item">
<label class="layui-form-label">折扣率</label>
<div class="layui-input-block">
<input type="text" name="vip_discount" id="vip_discount" placeholder="请输入折扣率">
</div>
</div>
JS 部分：
form.on('radio(is_vip_open)', function(data) {
var $input = layui.$('#vip_discount');
if (data.value === '1') {
$input.attr('lay-verify', 'required|number');
} else {
$input.removeAttr('lay-verify');
}
form.render('input'); // 关键：重载 input 类型渲染
});
注意：form.render('input') 不能写成 form.render()（会重载全部表单组件，可能破坏 radio 自身状态）；也不能漏掉，否则新规则不生效。
为什么 form.verify() 里自定义规则在这里不适用
自定义验证函数（如 form.verify({ myRule: function() {...} })）只在表单提交时执行一次，无法响应中间态变化。而「根据 radio 动态开关必填」本质是 UI 级联动，需要实时控制验证开关和视觉反馈。
容易踩的坑：
- 在
form.verify里写逻辑判断is_vip_open的值 → 提交时才跑，用户点完 radio 后立刻点提交，中间没做任何事，体验断层 - 用
form.val()读取 radio 值再判断 → 读的是当前值，但验证时机不对，且无法触发 input 边框变红等 UI 反馈 - 给 input 加了
lay-verify却忘了form.render('input')→ DOM 有属性，但 Layui 内部没注册该验证项，等于白加
input 必填状态切换后，如何避免提交时校验失败却无提示
单纯加 lay-verify="required" 不够，Layui 对空字符串、纯空格、undefined 的判定很严格。若用户清空了 input，又没手动触发校验，提交时可能静默失败。
实操建议：
- 在 radio 切换后，主动调用
form.validate('vip_discount')（需 Layui 2.9+）或手动触发一次校验逻辑 - 更稳妥的做法：radio 切换时，同时清空目标 input 的值，并移除其
layui-form-danger类（避免残留红框） - 后端接口也要同步校验逻辑，前端只是体验优化，不能替代服务端必填判断
- 如果目标 input 是数字类型，别只加
required，补上number规则，防止用户输字母后提交成功但后端报错
最常被忽略的一点：Layui 的 form.render() 是异步的，如果你紧接着调用 form.val() 或 form.validate()，可能读到旧值。需要确认渲染完成后再操作，必要时加 setTimeout 或监听 form.render.done 事件（非公开 API，慎用）。
