小程序省市区选择

小程序有自带省市区选择控件，非常方便，mode="region"即可

wxml代码：

<picker mode="region" bindchange="bindRegionChange" value="{{region}}" >
     <view class="choose-item">
      <text class="label-txt"><text class="dot">*</text>证件地址：</text>
      <text class="picker-text">{{region[0]}} {{region[1]}} {{region[2]}}</text>
      <image class="arrow-down" mode="widthFix" src="../../imgs/arrow_down.png"></image>
    </view>
  </picker>

js代码：

data: {
    region: ['请选择省市区/县', '', '']
｝,
bindRegionChange: function (e) {
    this.setData({
      region: e.detail.value
    })
}
   
  

region是一个长度为3的数组，将第一个元素赋值可作为placeholder默认值

wxss代码：

.choose-item{
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    width: 100%;
    padding-top: 25rpx;
    padding-bottom: 25rpx;
}
.label-txt{
    width: 30%;
    color: #666666;
    font-size: 32rpx;
}
.picker-text{
    width: 66%;
    color: #999999;
    font-size: 32rpx;
}
.arrow-down{
    width: 30rpx;
}