小程序：选择省市区

<!-- 选择省、市、区 -->
<view class="area">
    <!-- 选择省市区的弹窗模态框 -->
    <picker mode="region" bindchange="bindRegionChange" value="{{region}}"
    custom-item="{{customItem}}" style='width:100%;'>
    <!-- if条件 -->
    <view class="selectedType padd-24" wx:if="{{area}}">
      <text class="seletedText">选择省、市、区</text>
      <navigator class="more">
        <image src='{{rightArrow}}' class='rightArrow' />
      </navigator>
    </view>
    <!-- else if条件 -->
     <view class="selectedType padd-24" wx:else>
      <input class='selectShopType' value='{{region[0]}}，{{region[1]}}，{{region[2]}}' name="region" />
    </view> 
</picker>

/* 选择省市区 */
.area {
  width: 100%;
}
.selectedType {
  width: 100%;
  height: 89rpx;
  display: flex;
  border-top: 1rpx solid #ece9e9;
  justify-content: space-between;
  line-height: 89rpx;
  font-size: 28rpx;
  color: #282828;
}
.selectShopType {
  width: 100%;
  height: 100%;
}

data: {
    // 选择省市区
    area: true,
    region: ['广东省', '惠州市', '惠城区']
}


    // 选择省市区
  bindRegionChange: function (res) {
    console.log(res.detail.value)
    this.setData({
      region: res.detail.value,
      area: false
    })
  },

 

 

重点在于页面的wx:if和wx:else判断