• <fieldset id="8imwq"><menu id="8imwq"></menu></fieldset>
  • <bdo id="8imwq"><input id="8imwq"></input></bdo>
    最新文章專題視頻專題問答1問答10問答100問答1000問答2000關(guān)鍵字專題1關(guān)鍵字專題50關(guān)鍵字專題500關(guān)鍵字專題1500TAG最新視頻文章推薦1 推薦3 推薦5 推薦7 推薦9 推薦11 推薦13 推薦15 推薦17 推薦19 推薦21 推薦23 推薦25 推薦27 推薦29 推薦31 推薦33 推薦35 推薦37視頻文章20視頻文章30視頻文章40視頻文章50視頻文章60 視頻文章70視頻文章80視頻文章90視頻文章100視頻文章120視頻文章140 視頻2關(guān)鍵字專題關(guān)鍵字專題tag2tag3文章專題文章專題2文章索引1文章索引2文章索引3文章索引4文章索引5123456789101112131415文章專題3
    問答文章1 問答文章501 問答文章1001 問答文章1501 問答文章2001 問答文章2501 問答文章3001 問答文章3501 問答文章4001 問答文章4501 問答文章5001 問答文章5501 問答文章6001 問答文章6501 問答文章7001 問答文章7501 問答文章8001 問答文章8501 問答文章9001 問答文章9501
    當(dāng)前位置: 首頁 - 科技 - 知識百科 - 正文

    微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能示例

    來源:懂視網(wǎng) 責(zé)編:小采 時間:2020-11-27 21:56:15
    文檔

    微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能示例

    微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能示例:本文實例講述了微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能。分享給大家供大家參考,具體如下: wxml部分: <picker mode=multiSelector bindchange=bindjobcatchange bindcolumnchange=bingjobcatcolumnchange v
    推薦度:
    導(dǎo)讀微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能示例:本文實例講述了微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能。分享給大家供大家參考,具體如下: wxml部分: <picker mode=multiSelector bindchange=bindjobcatchange bindcolumnchange=bingjobcatcolumnchange v

    本文實例講述了微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能。分享給大家供大家參考,具體如下:

    wxml部分:

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

    js部分:

    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' // 默認(rèn)值
     },
     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)
     }
    })
    
    

    php后臺部分:

    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);
    }
    
    

    另外,本站在線工具小程序上的天氣查詢、車牌號歸屬地查詢以及陰歷陽歷轉(zhuǎn)換等工具就采用了聯(lián)動查詢功能,感興趣的朋友可以掃描如下小程序碼查看:

    希望本文所述對大家微信小程序開發(fā)有所幫助。

    聲明:本網(wǎng)頁內(nèi)容旨在傳播知識,若有侵權(quán)等問題請及時與本網(wǎng)聯(lián)系,我們將在第一時間刪除處理。TEL:177 7030 7066 E-MAIL:11247931@qq.com

    文檔

    微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能示例

    微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能示例:本文實例講述了微信小程序?qū)崿F(xiàn)的picker多級聯(lián)動功能。分享給大家供大家參考,具體如下: wxml部分: <picker mode=multiSelector bindchange=bindjobcatchange bindcolumnchange=bingjobcatcolumnchange v
    推薦度:
    標(biāo)簽: 小程序 中的 微信小程序
    • 熱門焦點

    最新推薦

    猜你喜歡

    熱門推薦

    專題
    Top
    主站蜘蛛池模板: 久久精品国产亚洲av水果派| 精品国产一区二区三区免费| 97精品国产91久久久久久| 国产欧美日韩综合精品二区| 国产亚洲福利精品一区| 亚洲Av永久无码精品三区在线| 国产精品秘入口福利姬网站| 国产日韩欧美精品| 99精品人妻无码专区在线视频区| 亚洲精品二三区| 久久99精品久久久久久噜噜| 国产精品无码素人福利不卡| 欧美国产日韩精品| 99热这里只有精品在线| 欧美亚洲色综久久精品国产| 亚洲成网777777国产精品| 精品国产91久久久久久久a | 97精品伊人久久大香线蕉app| 亚洲精品无码专区在线在线播放| 日韩视频中文字幕精品偷拍| 精品午夜福利1000在线观看| 国产在线精品一区二区夜色| 国产精品日韩欧美在线第3页| 3级黄性日本午夜精品| 亚洲欧洲国产精品你懂的| 精品国产日产一区二区三区 | 蜜臀久久99精品久久久久久| 国产精品伦理久久久久久| 98精品国产自产在线XXXX| 日本精品久久久久中文字幕| 精品国产福利久久久| 欧美777精品久久久久网| 欧美精品国产日韩综合在线| 亚洲精品你懂的| 91麻豆精品国产91久久久久久 | 在线亚洲欧美中文精品| 一本一本久久A久久综合精品| 亚洲国产精品一区二区第四页| 午夜福利麻豆国产精品| 亚洲色精品88色婷婷七月丁香 | 亚洲国产精品无码久久98|