微信小程序 picker 組件 mode=date 是三級聯(lián)動的，但是無法自定義。
picker-view 組件可以同時選擇多項，但是不能做到聯(lián)動，所以就想著要不采用3個 picker組件組合聯(lián)動試試。反正剛開始學，就來練練手，卷起袖子擼起來 >>>

// test.wxml
<view class="container">
    <view class="item">
        <text class="item-name">地址</text>
        <text class="item-content">{{province}} {{city}} {{area}}</text>
        <image class="arrow_left" src="../../images/play.png"></image>
    </view>
    <view style="display:flex;">
        <picker-view indicator-style="height: 50px;" style="width: 100%;height: 150px;text-align: center" value="{{value}}" bindchange="changeProvince">
            <picker-view-column>
                <view wx:for="{{provinces}}" wx:key="*this" style="line-height: 50px">{{item}}</view>
            </picker-view-column>
        </picker-view>
        <picker-view indicator-style="height: 50px;" style="width: 100%;height: 150px;text-align: center" value="{{value}}" bindchange="changeCity">
            <picker-view-column>
                <view wx:for="{{citys}}" wx:key="*this" style="line-height: 50px">{{item}}</view>
            </picker-view-column>
        </picker-view>
        <picker-view indicator-style="height: 50px;" style="width: 100%;height: 150px;text-align: center" value="{{value}}" bindchange="changeArea">
            <picker-view-column>
                <view wx:for="{{areas}}" wx:key="*this" style="line-height: 50px">{{item}}</view>
            </picker-view-column>
        </picker-view>
    </view>
</view>

//test.js  截取了部分省市區(qū)數(shù)據(jù)
  const placeArray = [
    {
      "name": "北京",
      "city": [{
        "name": "北京",
        "area": ["東城區(qū)", "西城區(qū)", "崇文區(qū)", "宣武區(qū)", "朝陽區(qū)", "豐臺區(qū)", "石景山區(qū)", "海淀區(qū)", "門頭溝區(qū)", "房山區(qū)", "通州區(qū)", "順義區(qū)", "昌平區(qū)", "大興區(qū)", "平谷區(qū)", "懷柔區(qū)", "密云縣", "延慶縣"]
      }]
    },

    {
      "name": "天津",
      "city": [{
        "name": "天津",
        "area": ["和平區(qū)", "河東區(qū)", "河西區(qū)", "南開區(qū)", "河北區(qū)", "紅橋區(qū)", "塘沽區(qū)", "漢沽區(qū)", "大港區(qū)", "東麗區(qū)", "西青區(qū)", "津南區(qū)", "北辰區(qū)", "武清區(qū)", "寶坻區(qū)", "寧河縣", "靜海縣", "薊  縣"]
      }]
    },

    {
      "name": "河北",
      "city": [

        {
          "name": "石家莊",
          "area": ["長安區(qū)", "橋東區(qū)", "橋西區(qū)", "新華區(qū)", "郊  區(qū)", "井陘礦區(qū)", "井陘縣", "正定縣", "欒城縣", "行唐縣", "靈壽縣", "高邑縣", "深澤縣", "贊皇縣", "無極縣", "平山縣", "元氏縣", "趙  縣", "辛集市", "藁", "晉州市", "新樂市", "鹿泉市"]
        },

        {
          "name": "唐山",
          "area": ["路南區(qū)", "路北區(qū)", "古冶區(qū)", "開平區(qū)", "新  區(qū)", "豐潤縣", "灤  縣", "灤南縣", "樂亭縣", "遷西縣", "玉田縣", "唐?？h", "遵化市", "豐南市", "遷安市"]
        },

        {
          "name": "秦皇島",
          "area": ["海港區(qū)", "山海關區(qū)", "北戴河區(qū)", "青龍滿族自治縣", "昌黎縣", "撫寧縣", "盧龍縣"]
        },

        {
          "name": "邯鄲",
          "area": ["邯山區(qū)", "叢臺區(qū)", "復興區(qū)", "峰峰礦區(qū)", "邯鄲縣", "臨漳縣", "成安縣", "大名縣", "涉  縣", "磁  縣", "肥鄉(xiāng)縣", "永年縣", "邱  縣", "雞澤縣", "廣平縣", "館陶縣", "魏  縣", "曲周縣", "武安市"]
        },

        {
          "name": "邢臺",
          "area": ["橋東區(qū)", "橋西區(qū)", "邢臺縣", "臨城縣", "內丘縣", "柏鄉(xiāng)縣", "隆堯縣", "任  縣", "南和縣", "寧晉縣", "巨鹿縣", "新河縣", "廣宗縣", "平鄉(xiāng)縣", "威  縣", "清河縣", "臨西縣", "南宮市", "沙河市"]
        },

        {
          "name": "保定",
          "area": ["新市區(qū)", "北市區(qū)", "南市區(qū)", "滿城縣", "清苑縣", "淶水縣", "阜平縣", "徐水縣", "定興縣", "唐  縣", "高陽縣", "容城縣", "淶源縣", "望都縣", "安新縣", "易  縣", "曲陽縣", "蠡  縣", "順平縣", "博野", "雄縣", "涿州市", "定州市", "安國市", "高碑店市"]
        },

        {
          "name": "張家口",
          "area": ["橋東區(qū)", "橋西區(qū)", "宣化區(qū)", "下花園區(qū)", "宣化縣", "張北縣", "康保縣", "沽源縣", "尚義縣", "蔚  縣", "陽原縣", "懷安縣", "萬全縣", "懷來縣", "涿鹿縣", "赤城縣", "崇禮縣"]
        },

        {
          "name": "承德",
          "area": ["雙橋區(qū)", "雙灤區(qū)", "鷹手營子礦區(qū)", "承德縣", "興隆縣", "平泉縣", "灤平縣", "隆化縣", "豐寧滿族自治縣", "寬城滿族自治縣", "圍場滿族蒙古族自治縣"]
        },

        {
          "name": "滄州",
          "area": ["新華區(qū)", "運河區(qū)", "滄  縣", "青  縣", "東光縣", "海興縣", "鹽山縣", "肅寧縣", "南皮縣", "吳橋縣", "獻  縣", "孟村回族自治縣", "泊頭市", "任丘市", "黃驊市", "河間市"]
        },

        {
          "name": "廊坊",
          "area": ["安次區(qū)", "固安縣", "永清縣", "香河縣", "大城縣", "文安縣", "大廠回族自治縣", "霸州市", "三河市"]
        },

        {
          "name": "衡水",
          "area": ["桃城區(qū)", "棗強縣", "武邑縣", "武強縣", "饒陽縣", "安平縣", "故城縣", "景  縣", "阜城縣", "冀州市", "深州市"]
        }

      ]
    }];
  var provinces = [];
  var citys = [];
  var areas = [];

  function getProvinces(){
    for (let i = 0; i < placeArray.length; i++) {
      provinces.push(placeArray[i].name)
    }
    console.log(provinces)
  }

  function getCitys(n){
    citys = [];
    const theCitys = placeArray[n].city;
    for (let i = 0; i < theCitys.length; i++) {
      citys.push(theCitys[i].name)
    }
    console.log(citys)
  }

  function getAreas(m,n){
    areas = [];
    if(placeArray[m].city[n]){  //province修改，city.length會逐個變化，若變化后比變化前小，會報錯
      const theAreas = placeArray[m].city[n].area;
      for (let i = 0; i < theAreas.length; i++) {
        areas.push(theAreas[i])
      }
      console.log(areas)
    }
  }
  //初始化
  getProvinces()
  getCitys(0)
  getAreas(0,0)

Page({
  data:{
    provinces: provinces,
    province: provinces[0] || "",
    pIndex: 0,
    citys: citys || [],
    city: citys[0] || "",
    cIndex: 0,
    areas: areas || [],
    area: areas[0] || "",
    aIndex: 0
  },
  changeProvince: function(e){
    const val = e.detail.value
    getCitys(val)   //聯(lián)動
    getAreas(val,0)  //聯(lián)動
    this.setData({
      province: provinces[val],
      pIndex: val,
      citys: citys,
      city: citys[0],
      cIndex: 0,
      areas: areas,
      area: areas[0],
      aIndex: 0
    })
  },
  changeCity: function(e){
    const val = e.detail.value
    getAreas(this.data.pIndex,val)  //聯(lián)動
    this.setData({
      city: citys[val],
      cIndex: val,
      areas: areas,
      area: areas[0],
      aIndex: 0
    })
  },
  changeArea: function(e){
    const val = e.detail.value
    this.setData({
      area: areas[val],
      aIndex: val
    })
  }
})

效果如圖：

省市區(qū)三級聯(lián)動.gif

總結：湊合能用吧，歡迎板磚。缺點是，省市改變后，后面的數(shù)據(jù)不會滾動到最頂端來。暫時還不知道怎么搞，如果您有相應的解決辦法，還請給我留言，3Q ^_

自己找到了新的更簡單高效的解決方法：微信小程序：省市區(qū)三級聯(lián)動（升級版）