这就是我们要实现的效果
<view class="consignee"> <!-- consignee 收件人 --> <text>收件人: </text><input type=\'text\' placeholder=\'请输入姓名\'></input> </view> <!-- 手机号 --> <view class="consignee"> <text>手机号: </text><input type=\'text\' placeholder=\'请输入手机号\'></input> </view> <!--所在地区 --> <view bindtap=\'selectDistrict\' class=\'consignee\'> <text >所在地区</text> <text>{{areaInfo}}</text> </view> <!-- 详细地址 --> <view class=\'consignee\'> <text>详细地址</text> <input type=\'text\' placeholder=\'请输入详细地址\'></input> </view> <!-- 完成 --> <button class=\'btn\'>完成</button> <view class="picker-view" animation="{{animationAddressMenu}}" style="visibility:{{addressMenuIsShow ? \'visible\':\'hidden\'}}"> <view style="height:10% ;width:95%;margin-top:10rpx"> <text catchtap="cityCancel">取消</text> <text style="float: right" catchtap="citySure">确定</text> </view> <!--"可以显示默认的城市，使用后级联选择城市反应很慢就不使用了--> <picker-view style="width: 100%; height: 300px;" bindchange="cityChange" value="{{value}}" wx:key=""> <picker-view-column> <view wx:for="{{provinces}}" class="picker-item" wx:key="index"> {{item.name}}</view> </picker-view-column> <picker-view-column> <view wx:for="{{citys}}" class="picker-item" wx:key=""> {{item.name}}</view> </picker-view-column> <picker-view-column> <view wx:for="{{areas}}" class="picker-item" wx:key=""> {{item.name}}</view> </picker-view-column> </picker-view> </view>