getData(parentId) { var that = this; //请求的url，由后台决定，此处填入你的请求url即可 var url = config.getArea + "?parentId=" + parentId; wx.request({ url: url, success: (res) => { console.log("地区数据请求成功"); console.log(res) if (res.data.length != 0) { flag = 0; //设置数据到全局变量 that.setData({ areaList: res.data, }); }else{ //已到最后一层数据 flag = 1; } }, method: "POST", header: { "content-type": "application/x-www-form-urlencoded;charset=utf-8", }, fail: (res) => { console.log("地区数据请求失败"); } }) },
点击地区数据执行bindArea
bindArea: function(e) { //如果未到最后一层，即可向下执行 if(flag == 0){ console.log(e); var that = this; //获取html传参，获取用户点击信息 var parentId = e.currentTarget.dataset.id; var city = e.currentTarget.dataset.city; //根据用户点击的数据，传入当前的id作为下一层的parentId，请求下一层数据， that.getData(parentId); //记录用户选择 chooseCity[nav] = city; //用户点击取消，到此层时，需要使用当前的parientid来请求此层应显示的数据 finalParentId[nav] = e.currentTarget.dataset.parentid; //记录路径数+1 nav++; console.log(chooseCity) //更新用户选择地区显示 that.setData({ finalCity:chooseCity[0]+chooseCity[1]+chooseCity[2] }) } },
点击取消，执行方法cancleChoose
cancleChoose:function(e){ var that = this; //已是最后一层，则返回上一页 if(nav == 0){ wx.navigateBack(); } else { //记录路径数-1 nav = nav - 1; //将上次已选择的地区清空 chooseCity[nav] = ""; console.log(chooseCity); //更新选择数据 that.setData({ finalCity: chooseCity[0] + chooseCity[1] + chooseCity[2] }) //根据finalParent中记录的每一层应请求的数据来更新地区数据 that.getData(finalParentId[nav]); } },
点击确定，执行方法submitChoose
submitChoose:function(e){ //如果未到最后一层，表示地址未选择完，如果不需要选择完整地址，此处去掉即可 if(flag != 1){ util.showLog("请选择完整地址") return; }else{ //存储数据到全局变量中，采用了json的方式存储，可以分别存储省市区数据 var address_components = { "province": "", "city": "", "district": ""}; address_components["province"] = chooseCity[0]; address_components["city"] = chooseCity[1]; address_components["district"] = chooseCity[2]; console.log(address_components); app.globalData.address_components = address_components; //返回上一次页面 wx.navigateBack(); } },
谢谢大家查看，评论里希望贴出cityChoose.js 及 util.js ，在下面贴出来啦，注：util.js里不是所有方法都要用到。
希望能够帮助到大家。
cityChoose