这篇文章给大家分享的是有关微信小程序中如何实现ecshop地址三级联动的内容。小编觉得挺实用的,因此分享给大家做个参考,一起跟随小编过来看看吧。
网站建设哪家好,找成都创新互联!专注于网页设计、网站建设、微信开发、小程序开发、集团企业网站建设等服务项目。为回馈新老客户创新互联还提供了舒城免费建站欢迎大家使用!微信小程序如何实现ecshop地址3级联动
picker标签,官方给出的实例:
Page({ data: { array: ['美国', '中国', '巴西', '日本'], index: 0, }, bindPickerChange: function(e) { console.log('picker发送选择改变,携带值为', e.detail.value) this.setData({ index: e.detail.value }) }, }) 地区选择器 当前选择:{{array[index]}}
wxml页面:
收货地址 {{province[provinceIndex]}} {{city[cityIndex]}} {{district[districtIndex]}}
js页面:
var app = getApp() Page({ data:{ motto: 'jxcat', serverUrl: app.globalData.ajaxUrl, baseUrl: app.globalData.baseUrl, title: "收货地址", address_id: "", address: "", province:[], province_id: [], //后台返回的数据对应 region_id city,district 与此相同 province_name: [], //后台返回的数据对应 region_name provinceIndex: 0, //wxml页面选择的选项,从0开始 provinceId: 0, //根据wxml页面选择的选项获取到province_id: []对应的region_id city:[]. city_id: [], city_name: [], cityIndex: 0, cityId: 0, district:[], district_id: [], district_name: [], districtIndex: 0, districtId: 0, }, onLoad:function(options){ // 页面初始化 options为页面跳转所带来的参数 var that = this var get_data wx.checkSession({ success: function(){ //登录态未过期 wx.getStorage({ key: 'wcx_session', success: function(sres) { get_data = { m: 'api', c: 'user' , a: 'edit_address', wcx_session: sres.data, } if(options.act == 'edit'){ get_data = { m: 'api', c: 'user' , a: 'edit_address', id: options.id, wcx_session: sres.data, } } wx.request({ url: app.globalData.ajaxUrl, data: get_data, header: { 'content-type': 'application/json' }, success: function(res) { if(options.act == "edit"){ that.data.provinceId = res.data.consignee.province that.data.cityId = res.data.consignee.city that.data.districtid = res.data.consignee.district } for(var i=0; i感谢各位的阅读!关于“微信小程序中如何实现ecshop地址三级联动”这篇文章就分享到这里了,希望以上内容可以对大家有一定的帮助,让大家可以学到更多知识,如果觉得文章不错,可以把它分享出去让更多的人看到吧!
另外有需要云服务器可以了解下创新互联建站www.cdcxhl.com,海内外云服务器15元起步,三天无理由+7*72小时售后在线,公司持有idc许可证,提供“云服务器、裸金属服务器、高防服务器、香港服务器、美国服务器、虚拟主机、免备案服务器”等云主机租用服务以及企业上云的综合解决方案,具有“安全稳定、简单易用、服务可用性高、性价比高”等特点与优势,专为企业上云打造定制,能够满足用户丰富、多元化的应用场景需求。
标题名称:微信小程序中如何实现ecshop地址三级联动-创新互联
标题路径:http://cdweb.net/article/dehjpp.html