最近手头上有个需求,就是建表时建表部门必须选该部门对应人员,只有选择到的人员才有权利操控这个表,部门和人员都可多选;按照原型图,决定使用el-cascader级联选择器,但看似简单的两个多选级联框,能碰到的问题都被我遇到了,接来下详细阐述,希望对大家有帮助;
1,首先,是报错问题,看下图:
导致报错的原因有百度,大部分都是说给cascader加key值,然后动态改变cascader的值,cascader++操作,但至于具体在哪cascader++操作,众说纷纭,也没有具体讲清楚,接下来上代码:
关键之处在这:实现cascader++需要监听option变化时给与赋值;
还是挺简单的,三步操作就解决了;
2,清空按钮需要点击至少2次才能清空数据问题,截图这里需要点击5次,o(╥﹏╥)o看图:
这个问题其实主要跟个人代码里面处理数据有关系;涉及到数组去重;
因为一个部门对应多个人员,给后端传数据的时候,后台要求的数据格式是按人加部门为一个对象传数组,多个人就会有多个相同部门对应不同人员的对象数组,部门跟人员放在一个数组里面传,但是回显需要分开的,这就要求拿到详情数据后需要自己处理,最终发现,处理的部门数组有多个相同的机构编码,因为多个人员对应同一个部门,按人员个数返回(如上图,6个人员就有6个orgcode),当然回显没有问题,但是操作上就有问题了,所以我们要对数组进行去重,这样就不会造成多次点击才生效的情况;
这里提供一个去重的好方法给大家,上图:
至此,问题都解决了,希望能帮到遇到同类问题的你们!