van-picker级联选择（获取字段+children为null的坑+搜索功能）

//data返回数据数组，index返回索引数组  
onConfirm(data,index)
 {   
     let vm = this;
     let str = "";  // 呈现页面显示  /xxx/xxx/xxx
     for(let i = 0;i < data.length; i ++){
         if(i>0){
             str += "/" + data[i];
         }
         else{
             str +=data[i];
         }
     }
     // 获取一级分类
     vm.form.oneCategoryId = vm.columns[index[0]].id;
     vm.form.oneCategoryName = vm.columns[index[0]].name;
     // 获取二级分类
     if(vm.columns[index[0]].children !== undefined){
       vm.form.twoCategoryId =vm.columns[index[0]].children[index[1]].id;
       vm.form.twoCategoryName =vm.columns[index[0]].children[index[1]].Name;
     }
     this.form.kind = str;
     this.showPicker = false
 }

picker级联选择功能的bug

/** 问题:
使用级联选择功能时，
1-1  如果数组的第一项的子项（children）为空字符串，会导致渲染不出来第二列。 
1-2  如果某一项的子项为空字符串，此项的子项在页面上会显示之前的子项。**/

解决：
把数组的第一项或某一项设的子项（children）置为空字符串即可复现

this.tableData = res.data.map((item, index) => {
     //item.text = item.name;
     //delete item.name;
     //if (item.children.length > 0) {
     //  item.children = item.children.map((value, i) => {
     //    value.text = value.name;
     //    delete value.name;
     //    return value;
     //  });
     //} 
     if(item.children==null) {
       item.children = [{ text: "", id: "" }];//子项（children）置为空字符串
     }
     return item;
});

vant picker选择器组件增加search搜索功能（两种样式）

1.直接放到pop里面与picker同级

2.直接放到picker中

watch: {  //实时监听搜索输入内容
    searchKey: function () {
      let key = String( this.searchKey );
      key =  key.replace( /\s*/g, "" );　　//去除搜索内容中的空格
      const reg new RegExp( key, "ig" );　//匹配规则-i：忽略大小写，g：全局匹配
      /* 进行筛选，将筛选后的数据放入新的数组中，‘name’键可根据需要搜索的key进行调整 */
      this.searchColumns = this.columns.filter( item => item.name.match( reg ) !=null );　　
    }
  }