1.首先引入工具类,递归获取父级
export function cascadeDisplay(object, value) {
for (var key in object) {
if (object[key].value == value) return [object[key].value]
if (object[key].children && Object.keys(object[key].children).length > 0) {
var temp = cascadeDisplay(object[key].children, value)
if (temp) return [object[key].value, temp].flat()
}
}
}
2.在需要使用的页面进行使用
先引入工具类
import { cascadeDisplay } from '@/utils/index'
将拿到的数据先转换为数组,之后遍历当前数据,找出父级追加,
this.form.productIds为级联选择器绑定的v-model值
this.AddprocessOptions为数据源,及绑定的options值
playback() {
// 先把接过来的数据转换为数组
this.form.productIds = this.form.productIds.split(',')
// 之后遍历,获取父节点
this.form.productIds.forEach((element) => {
let selectSubsidiaryDepartment = [
cascadeDisplay(this.AddprocessOptions, element)
]
this.form.productIds.push(...selectSubsidiaryDepartment)
})
},
此处为级联选择器多选时使用,单选回显只需要去掉数据框
let selectSubsidiaryDepartment = cascadeDisplay(this.AddprocessOptions, element)