小程序 二级联动 区--街道

WXML

<view class="section">
  <picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" value="{{multiIndex}}" range="{{multiArray}}">
    <view class="picker">
      {{multiArray[0][multiIndex[0]]}},{{multiArray[1][multiIndex[1]]}}
    </view>
  </picker>
</view>

JS

// pcity/pcity.js
var that
var list = []
Page({

  /**
   * 页面的初始数据
   */
  data: {
    multiIndex: [],
    multiArray: [
      ['福田区', '罗湖区', "南山区", "盐田", "龙岗区", "宝安区", "光明新区", "龙华新区", "坪山新区"],
      ['园岭', '南园', '华富', '莲花', '福田', '沙头', '香蜜湾', '福保', '华强北', '梅林']
    ],
    objectMultiArray: [{
        "regid": "2",
        "parid": "1",
        "regname": "福田区",
        "regtype": "1",
        "ageid": "0"
      },
      {
        "regid": "3",
        "parid": "1",
        "regname": "罗湖区",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "4",
        "parid": "1",
        "regname": "南山区",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "5",
        "parid": "1",
        "regname": "盐田",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "6",
        "parid": "1",
        "regname": "龙岗区",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "7",
        "parid": "1",
        "regname": "宝安区",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "8",
        "parid": "1",
        "regname": "光明新区",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "9",
        "parid": "1",
        "regname": "龙华新区",
        "regtype": "1",
        "ageid": "0"
      }, {
        "regid": "10",
        "parid": "1",
        "regname": "坪山新区",
        "regtype": "1",
        "ageid": "0"
      },

      {
        "regid": "36",
        "parid": "3",
        "regname": "黄贝",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "37",
        "parid": "3",
        "regname": "东门",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "38",
        "parid": "3",
        "regname": "南湖",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "39",
        "parid": "3",
        "regname": "桂园",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "40",
        "parid": "3",
        "regname": "笋岗",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "41",
        "parid": "3",
        "regname": "清水河",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "42",
        "parid": "3",
        "regname": "翠竹",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "43",
        "parid": "3",
        "regname": "东湖",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "44",
        "parid": "3",
        "regname": "东晓",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "45",
        "parid": "3",
        "regname": "莲塘",
        "regtype": "2",
        "ageid": "0"
      },


      {
        "regid": "53",
        "parid": "4",
        "regname": "南头",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "54",
        "parid": "4",
        "regname": "南山",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "55",
        "parid": "4",
        "regname": "招商",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "56",
        "parid": "4",
        "regname": "蛇口",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "57",
        "parid": "4",
        "regname": "粤海",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "58",
        "parid": "4",
        "regname": "沙河",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "59",
        "parid": "4",
        "regname": "西丽",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "60",
        "parid": "4",
        "regname": "桃源",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "62",
        "parid": "5",
        "regname": "沙头角",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "63",
        "parid": "5",
        "regname": "梅沙",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "64",
        "parid": "5",
        "regname": "盐田",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "65",
        "parid": "5",
        "regname": "海山",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "76",
        "parid": "6",
        "regname": "布吉",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "77",
        "parid": "6",
        "regname": "坂田",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "78",
        "parid": "6",
        "regname": "南湾",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "79",
        "parid": "6",
        "regname": "平湖",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "80",
        "parid": "6",
        "regname": "龙岗",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "81",
        "parid": "6",
        "regname": "横岗",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "82",
        "parid": "6",
        "regname": "龙城",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "83",
        "parid": "6",
        "regname": "坪地",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "84",
        "parid": "6",
        "regname": "坑梓",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "97",
        "parid": "7",
        "regname": "新安",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "98",
        "parid": "7",
        "regname": "西乡",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "99",
        "parid": "7",
        "regname": "福永",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "100",
        "parid": "7",
        "regname": "沙井",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "101",
        "parid": "7",
        "regname": "石岩",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "102",
        "parid": "7",
        "regname": "松岗",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "112",
        "parid": "8",
        "regname": "公明",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "113",
        "parid": "8",
        "regname": "光明",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "120",
        "parid": "9",
        "regname": "龙华",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "121",
        "parid": "9",
        "regname": "观澜",
        "regtype": "2",
        "ageid": "0"
      }, {
        "regid": "397",
        "parid": "10",
        "regname": "坪山",
        "regtype": "2",
        "ageid": "0"
      }
    ]
  },
  onLoad: function() {
    that = this
  },
  bindMultiPickerChange: function(e) {
    that.setData({
      "multiIndex[0]": e.detail.value[0],
      "multiIndex[1]": e.detail.value[1]
    })
  },
  bindMultiPickerColumnChange: function(e) {
    switch (e.detail.column) {
      case 0:
        list = []
        for (var i = 0; i < that.data.objectMultiArray.length; i++) {
          if (that.data.objectMultiArray[i].parid == that.data.objectMultiArray[e.detail.value].regid) {
            list.push(that.data.objectMultiArray[i].regname)
          }
        }
        that.setData({
          "multiArray[1]": list,
          "multiIndex[0]": e.detail.value,
          "multiIndex[1]": 0
        })

    }
  }

})