小程序：選擇省市區

<!-- 選擇省、市、區 -->
<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判斷