微信小程序 picker 多级联动

缺乏、安全感 2022-04-24 22:46 254阅读 0赞

<picker
              mode="multiSelector"
              bindchange="bindjobcatchange"
              bindcolumnchange="bingjobcatcolumnchange"
              value="{
       {multiIndex}}"
              range="{
       {job_cat_list}}"
               range-key="{
       {'cat_name'}}"
            >
              <view class="picker">
                {
       {fenlei_title}}
              </view>
            </picker>

Page({
      data: {
        server_url: app.globalData.URL,
        fenlei_title:'分类',
        job_cat_list:[],
        multiIndex: [0,0,0],
        filter:{
          keywords:'',
          job_cat_id:''
        }
      },
      onLoad: function () {   
        this.jobcat();
      },
      jobcat: function() {
        var that = this;
        wx.request({
          url: app.globalData.URL + "/xxx/eeee",
          data: {
            x: '',
            y: ''
          },
          header: {
            'content-type': 'application/json' // 默认值
          },
          success: function (res) {
            var data = res.data.data;
            that.setData({
              job_cat_list: [data, data[0]['children'], data[0]['children'][0]['children']]
            });
          }
        });
      },
      bindjobcatchange: function(e){
        this.setData({multiIndex:e.detail.value})
      },
      bingjobcatcolumnchange: function(e){
        var index = this.data.multiIndex;
        const data = {
          job_cat_list: this.data.job_cat_list,
          multiIndex: this.data.multiIndex
        }
        this.data.multiIndex[e.detail.column] = e.detail.value;
    
        if (e.detail.column==0){
            data.job_cat_list[1] = this.data.job_cat_list[0][index[0]]['children'];
            data.job_cat_list[2] = data.job_cat_list[1][index[1]]['children'];
        }else if(e.detail.column===1){
            data.job_cat_list[2] = data.job_cat_list[1][index[1]]['children'];
            this.data.filter.job_cat_id = data.job_cat_list[2][index[2]]['cat_name'];
        }else if(e.detail.column===2){
          this.data.filter.job_cat_id=data.job_cat_list[2][e.detail.value]['cat_name'];
        }
    
        this.setData(data)
      }
    
    })

public function jobcate(){
            $zp_job_catModel = new ZpJobCat();
            $job_cat = $zp_job_catModel->getcateAll();
            $i=0;
            $return_data = [];
            foreach ($job_cat as $key=>$val){
                $return_data[$i] = $val;
                $return_data[$i]['children'] = [];
                if (!empty($val['children'])){
                    $c=0;
                    foreach ($val['children'] as $k=>$v){
                        $return_data[$i]['children'][$c] = $v;
                        if (!empty($v['children'])){
                            $return_data[$i]['children'][$c]['children'] = [];
                            $m=0;
                            foreach ($v['children'] as $val2){
                                $return_data[$i]['children'][$c]['children'][$m] = $val2;
                                $m++;
                            }
                        }
                        $c++;
                    }
                }
                $i++;
            }
            $this->_success($return_data);
        }