省市区地区选择器

2021-07-17 12:35:21 阅读：312 来源： 互联网

标签：right 地区 forms item 省市区 font 选择器 color size

效果图：

wxml:

<view class="item">
    <view class="left">联系地址：</view>
    <picker class="right" mode="region" bindchange="bindRegionChange" value="{{region}}" custom-item="{{customItem}}">
        <input placeholder="请输入您的联系地址！" name="area" placeholder-class="placeholder" value="{{regionVal}}" />
    </picker>
</view>

wxss:

.forms .item {
  border-bottom: 1rpx solid #ddd;
  display: flex;
  justify-content: space-between;
  padding: 18rpx 0;
}
.forms .item .left {
  font-size: 35rpx;
  color: #666;
  width: 180rpx;
}
.forms .item .right {
  flex: 1;
}
.forms .item .right input {
  text-align: right;
  font-size: 30rpx;
}
.forms .item .right .placeholder {
  color: #999;
  font-size: 28rpx;
}

data: {
  region: ["广东省", "广州市", "天河区"],
  regionVal: [],
},

// 地址选择
bindRegionChange: function (e) {
  console.log("picker发送选择改变，携带值为", e.detail.value);
  this.setData({
    regionVal: e.detail.value,
  });
},

标签：right,地区,forms,item,省市区,font,选择器,color,size
来源： https://www.cnblogs.com/cdnotes/p/15023099.html

本站声明： 1. iCode9 技术分享网（下文简称本站）提供的所有内容，仅供技术学习、探讨和分享；
2. 关于本站的所有留言、评论、转载及引用，纯属内容发起人的个人观点，与本站观点和立场无关；
3. 关于本站的所有言论和文字，纯属内容发起人的个人观点，与本站观点和立场无关；
4. 本站文章均是网友提供，不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属；如您发现该文章侵犯了您的权益，可联系我们第一时间进行删除；
5. 本站为非盈利性的个人网站，所有内容不会用来进行牟利，也不会利用任何形式的广告来间接获益，纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

ICode9

省市区地区选择器