其中u-popup是u-view的ui組件
<u-popup v-model="showAlarmType" mode="bottom">
<picker-view class="picker-view" :value="region" @change="bindChange">
<view class="confirmBtn">
<view @click="cancel">取消</view>
<view @click="confirm">確認(rèn)</view>
</view>
<picker-view-column>
<view class="item" v-for="(item,index) in alarmTypeList" :key="index">{{ item.commName }}</view>
</picker-view-column>
<picker-view-column v-if="alarmTypeList[region[0]]">
<view class="item" v-for="(sub,index) in alarmTypeList[region[0]].children" :key="index">{{ sub.commName }}</view>
</picker-view-column>
</picker-view>
</u-popup>
data部分(如何獲取聯(lián)動(dòng)的二級(jí)數(shù)據(jù))
data(){
return {
region:[0,0],
showAlarmType:false,
alarmTypeList:null
}
},
methods:{
bindChange(e){
const val = e.detail.value
if(this.region[0] !== val[0]) {
// 如果滑動(dòng)的是第一列數(shù)據(jù)，讓二三列恢復(fù)到0
this.region = [val[0], 0]
}
}
}
附加：
alarmTypeList數(shù)據(jù)結(jié)構(gòu)
565387d5ec144d2aa80bb6369a059647.png
