因为业务逻辑,只需要级联的某个节点,所以在保存的时候,只会保存一个值,而不是以数组的形式保存。但是客户需求还是要使用级联选择,iview自带的级联选择,用的是很爽了,但是回显的时候,不能直接给这个组件的输入框内赋值。
![在这里插入图片描述](https://img-blog.csdnimg.cn/20210413103840731.jpg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L1JleDk5MTA=,size_16,color_FFFFFF,t_70#pic_center)
displayInputRender: "西湖 - 310000"
displayRender: "西湖 - 310000"
这两个在组件中是使用计算属性computed来计算的,所以就很坑了,没办法,只能用蠢办法,将树中的父节点找出来。重新塞入一个数组中,使用级联选择的默认值方式,v-model绑定。
arr为初始树参数,currentValue是回显的那个值,目的就是根据这个currentValue找出所有的父节点,values用来收集族谱关系,方法调用结束后将values赋值给级联默认值。值得注意的是,在使用递归方法的时候,某子节点的父级如果仍需遍历,不能直接将arr放入参数中,会出现循环跳过的情况,所以这里我使用的仍是初始化的树结构数据
initDeptArr(arr,currentValue,values){
let isContinue = true;
arr.forEach(f=>{
if (f.value===currentValue){
values.unshift(currentValue)
this.initDeptArr(this.depts,f.pvalue,values)
isContinue = false;
}else if (isContinue&&f.children){
this.initDeptArr(f.children,currentValue,values)
}
})
},
最后回显搞定了,不过这样写真的有些蠢了