一.场景/需求描述
人员爱好录入表单,爱好分为体育、文学、音乐、美术、其他。体育、文学、音乐、美术、其他字段需要手动填写具体项,这些字段默认隐藏,只有当 爱好字段多选框 选择对应内容之后才会将对应字段显示出来。
二.操作步骤
1.建模-建模参考:
2.设置表单-表单参考:
3.引入脚本:
4.脚本说明:
5.效果展示:
6.脚本
//注:另:r只读,b必填,w可填写,n隐藏。 let vmm = document.getElementsByName("online-form")[0].__vue__; //默认隐藏字段---开局隐藏 vmm.permission.fields.ryahlrzb.ty = 'n'; vmm.permission.fields.ryahlrzb.yl = 'n'; vmm.permission.fields.ryahlrzb.wx = 'n'; vmm.permission.fields.ryahlrzb.ms = 'n'; vmm.permission.fields.ryahlrzb.qt = 'n'; //单选框:将 data.ryahlr.ahlx 改成 data.ryahlr.ryxm vmm.$watch('data.ryahlr.ahlx',function(newVal, oldVal) { if (newVal.indexOf('体育') != -1) { vmm.permission.fields.ryahlrzb.ty = 'w'; } else { vmm.permission.fields.ryahlrzb.ty = 'n'; } if (newVal.indexOf('音乐') != -1) { vmm.permission.fields.ryahlrzb.yl = 'w'; } else { vmm.permission.fields.ryahlrzb.yl = 'n'; } if (newVal.indexOf('文学') != -1) { vmm.permission.fields.ryahlrzb.wx = 'w'; } else { vmm.permission.fields.ryahlrzb.wx = 'n'; } if (newVal.indexOf('美术') != -1) { vmm.permission.fields.ryahlrzb.ms = 'w'; } else { vmm.permission.fields.ryahlrzb.ms = 'n'; } if (newVal.indexOf('其他') != -1) { vmm.permission.fields.ryahlrzb.qt = 'w'; } else { vmm.permission.fields.ryahlrzb.qt = 'n'; } if (newVal.indexOf('全部') != -1) { vmm.permission.fields.ryahlrzb.ty = 'w'; vmm.permission.fields.ryahlrzb.yl = 'w'; vmm.permission.fields.ryahlrzb.wx = 'w'; vmm.permission.fields.ryahlrzb.ms = 'w'; vmm.permission.fields.ryahlrzb.qt = 'w'; } }, { immediate: true }); |
//单选的显示隐藏: //b必填,n隐藏,w编辑,r只读 let vmm = document.getElementsByName("online-form")[0].__vue__;//默认隐藏字段---开局隐藏 vmm.permission.fields.cs.nl = 'n'; // //单选框:将 data.ryahlr.ahlx 改成 data.ryahlr.ryxm vmm.$watch('data.cs.xm',function(newVal, oldVal) { if (newVal.indexOf('是') != -1) { vmm.permission.fields.cs.nl = 'b'; } else { vmm.permission.fields.cs.nl = 'n'; } }, { immediate: true }); |
7.注:r只读,b必填,w可填写,n隐藏。
8.扩展:单选框也可以直接用此脚本。单选框也可以通过直接配置实现。