<template>
<view class="container">
<view class="diygw-form-item diygw-col-24">
<view class="title">标题</view>
<view class="input">
<picker mode="multiSelector" @columnchange="changePickers" :value="pickersIndex" :range="pickersDatas">
<view class="uni-input">
{{ pickersDatas[0][pickersIndex[0]] }},
</view>
</picker>
</view>
</view>
</view>
</template>
<script>
//create by: 邓志锋 280160522@qq.com http://www.diygw.com
export default {
data() {
return {
input2: '',
date1: '',
pickersInitDatas: [{
"children": [{
"children": [{
"children": [],
"text": "无锡市"
}, {
"children": [],
"text": "深圳市"
}],
"text": "广州市"
}, {
"children": [{
"children": [],
"text": "梅州市"
}],
"text": "中山市"
}],
"text": "广东省"
}, {
"children": [],
"text": "江苏省"
}],
pickersDatas: [
['广东省', '江苏省'],
['广州市', '中山市'],
['无锡市', '深圳市']
],
pickersIndex: [0, 0, 0]
}
},
onShareAppMessage: function() {},
onLoad(option) {
if (option) {
this.setData({
globalOption: option
})
}
},
mounted() {
this.init();
},
methods: {
async init() {
},
getPickerChildren1(data,chindInex1,childIndex2){
if(chindInex1!=null && data[chindInex1] && data[chindInex1].children && data[chindInex1].children){
let children = data[chindInex1].children
//只判断一级
if(childIndex2==null){
if(children!=null && children.length>0){
return children.map(item=>item.text)
}else{
return []
}
}else{
//判断二级
//有可能并设置下级结点
if(children[childIndex2]==null){
return []
}
let children2 = children[childIndex2].children
if(children2!=null && children2.length>0){
return children2.map(item=>item.text)
}else{
return []
}
}
}else{
return []
}
},
changePickers(evt) {
this.pickersIndex[evt.detail.column] = evt.detail.value
if (evt.detail.column == 0) {
this.pickersIndex.splice(1, 1, 0)
this.pickersIndex.splice(2, 1, 0)
this.pickersDatas[1] = this.getPickerChildren1(this.pickersInitDatas,this.pickersIndex[0],null)
this.pickersDatas[2] = this.getPickerChildren1(this.pickersInitDatas,this.pickersIndex[0],0)
}else if (evt.detail.column == 1) {
this.pickersDatas[2] = this.getPickerChildren1(this.pickersInitDatas,this.pickersIndex[0],this.pickersIndex[1])
this.pickersIndex.splice(2, 1, 0)
}
this.$forceUpdate()
}
}
}
</script>
<style lang="scss"></style>