vant 级联选择器 tbody高度滑动

van-picker的级联‘

代码如下

没有级联的官网有代码,

关于级联中的默认值,也就是起先默认的一级和二级,打开级联框时默认选中

<div @click="openPicker()">{{pickerValue}}</div>
    <van-popover v-model="showPicker" position="bottom">
      <van-picker
        :columns="columns"
        show-toolbar
        :default-index="defaultIndex"
        @confirm="setData"
        @cancel="showPicker = false"
      ></van-picker>
    </van-popover>


      showPicker:false,
      defaultIndex:0,
      pickerValue0:'浙江',
      pickerValue:'温州',
      columns: [{
        text: '浙江',
        defaultIndex:NaN,
        children: [{
          text: '杭州',
          defaultIndex:NaN
        }, {
          text: '温州',
          defaultIndex:NaN
        }]
      }, {
        text: '福建',
        defaultIndex:NaN,
        children: [{
          text: '福州',
          defaultIndex:NaN
        }, {
          text: '厦门',
          defaultIndex:NaN
        }]
      }]

 怎样确定默认值

   setData(v){
      console.log(v);
      this.pickerValue = v[1]
      this.showPicker = false
    },
   openPicker(){
    //  打开筛选框的默认值
     this.columns.map((item,index)=>{
       if(this.pickerValue0===item.text){
         this.defaultIndex = parseInt(index)
         for(let i =0 ;i<item.children.length;i++){
           if(this.pickerValue === item.children[i].text){
             item.defaultIndex = parseInt(i)
           }
         }  
       }
     })
     console.log(this.columns);
     this.showPicker = true
   },


版权声明:本文为yusun1234原创文章,遵循CC 4.0 BY-SA版权协议,转载请附上原文出处链接和本声明。