再使用微信小程序時?

發現 當?mode="region"? ?時數據 選擇的省市區的數據不支持后臺返回的數據

以下實現后臺返回數據操作

先設置HTML

name 字段名字要替換掉

<view class=" h-100 b-b l-h-100"><picker mode="multiSelector" bindchange="bindMultiPickerChange" bindcolumnchange="bindMultiPickerColumnChange" range-key="name" value="{{multiIndex}}" range="{{multiArray}}"><view class="picker flex-r"><view class="bold"><text class="c-f00">*</text>地區</view> <text> {{multiArray[0][multiIndex[0]].name}}{{multiArray[1][multiIndex[1]].name}}{{multiArray[2][multiIndex[2]].name}} </text></view></picker></view>

在data中

data:{multiArray: [],//地區multiIndex: [0, 0, 0],type:0, }

首次進來查詢省市區數據

// POST 開發完成 // 獲取省市區首次調用 type傳0code 為查詢下級的id code 為空時則查詢省getcitycode(type，code){var self=thisvar {multiArray,multiIndex,code,street}=this.dataapp.ajax({code,url: '/shenshiqu',}, function (result) {multiArray[type]=result.data.dataif(type<2)self.getcitycode(type+1,result.data.data[index].taobaoid)})},

當滾動省獲或者市時 更新 并聯動

// 選擇省市區bindMultiPickerChange: function (e) {console.log('picker發送選擇改變，攜帶值為', e.detail.value)this.setData({multiIndex: e.detail.value})},// 選擇省市區bindMultiPickerColumnChange: function (e) {console.log('修改的列為', e.detail.column, '，值為', e.detail.value);var data = {multiArray: this.data.multiArray,multiIndex: this.data.multiIndex};data.multiIndex[e.detail.column] = e.detail.value;switch (e.detail.column) {case 0:console.log(data.multiArray[e.detail.column][e.detail.value].taobaoid)this.getcitycode(1,data.multiArray[e.detail.column][e.detail.value].taobaoid)break;case 1:console.log(data.multiArray[e.detail.column][e.detail.value].taobaoid)this.getcitycode(2,data.multiArray[e.detail.column][e.detail.value].taobaoid)break;}this.setData(data);},

喜歡的可以加人前端面試題庫，方便使用? 微信搜索 “MST題庫”

或者掃碼查看? 或有問題的掃碼聯系

?

總結

以上是生活随笔為你收集整理的实现微信小程序picker 省市区 自定义数据 支持三级联动的全部內容，希望文章能夠幫你解決所遇到的問題。

如果覺得生活随笔網站內容還不錯，歡迎將生活随笔推薦給好友。