在很多项目场景中都会使用到下拉级联组件,组件的数据格式有时候跟后端返回的数据格式也有些差异,这就需要我们手动的去转换为组件对应的格式,实现方式如下
这是后端返回的数据格式
转换为目标数据格式
实现代码如下
/**
* @description 此方法适用于二级树形数据结构
* @params list 遍历的数组
* @params loop 是否是子集循环
* @params itm 一级数据
*/
const handleMutilArrar = (list, loop = false, itm = null) => {
const listObj = itm
list.forEach((item, index) => {
const obj = {
label: item.dictionaryValueName,
value: item.dictionaryValueCode,
}
if (listObj) {
// 当有值传入的时候才把数据塞进children
listObj.children.push(obj)
}
if (!item.dictionaryValueVOS || item.dictionaryValueVOS.length === 0) {
// 当没有子集的时候且数组循环到最后一层的时候执行
if (listObj && index === list.length - 1) {
data.selectList.push(listObj)
}
// 当只有一级数据的时候
if (!listObj) {
data.selectList.push(obj)
}
} else {
// 当有子集的时候加入children字段,并将整个obj递归遍历
obj['children'] = []
handleMutilArrar(item.dictionaryValueVOS, true, obj)
}
})
}