picker多选 vant_vant 的picker如何绑定多级联动?

我自己写了一下,只不过这种不太通用,就是改变的时候没有让他一级一级往下获取,这个你们可以自行解决

`弹窗

`

`

var pickerData=[{

id:1,

name:'A区',

child:[{

id:11,

name:"1-11列",

},{

id:12,

name:"1-12列",

}]

},{

id:2,

name:'B区',

child:[{

id:21,

name:"2-21列",

},{

id:24,

name:"2-24列",

}]

}]

var vm = new Vue({

el: '#app',

data(){

return {

show:false,

address:[],//当前选中的盘点位置

columns:[{

values: [],

className: 'column1'

},{

values: [],

className: 'column2',

defaultIndex: 0

}],

}

},

created(){

for(var i in pickerData){

var obj = {

text:pickerData[i].name,

id:pickerData[i].id

}

this.columns[0].values.push(obj)

}

for(var i in pickerData[0].child){

var obj = {

text:pickerData[0].child[i].name,

id:pickerData[0].child[i].id

}

this.columns[1].values.push(obj)

}

},

methods:{

onCancel(){

this.show = false

},

onConfirm(picker,value,index){

console.log('onConfirm',picker,value,index)

this.address=[]

for(var i in picker){

this.address.push(picker[i].id)

}

this.show = false

},

onChange(picker,value,index){

console.log('onChange',picker,value,index)

if(index == 0){

var arr = []

for(var i in pickerData){

if(value[0].id == pickerData[i].id){

for(var x in pickerData[i].child){

var obj = {

text:pickerData[i].child[x].name,

id:pickerData[i].child[x].id

}

arr.push(obj)

}

}

}

picker.setColumnValues(1,arr)

}else if(index == 1){

}

}

}

})

`