小程序级联 picker

2021-10-01 18:04:05 阅读：308 来源： 互联网

标签：picker Town 级联程序 detail multiIndex var data objectMultiArray

 1 微信小程序 级联 pick，选择某乡镇 直接列出该乡镇的所有村
    
 2 <picker bindchange="bindPickerChange1" mode="multiSelector" bindcolumnchange="bindcolumnchange" value="{{index}}"
 3 range="{{xz}}">
 4 <picker-column>
 5 <picker-view> <input value="{{xz[index][multiIndex[0]]}}" type="text" />
 6 <input value="{{xz[index][multiIndex[1]]}}" type="text" />
 7 </picker-view>
 8 </picker-column>
 9 </picker>
10 
11  // pcity/pcity.js
12  var that
13  var list = []
14  Page({
15 
16    /**
17     * 页面的初始数据
18     */
19    data: {
20      multiIndex: [],
21      multiArray: [
22        ['突泉镇', '六户镇', "杜尔基镇", "水泉镇", "永安镇", "宝石镇", "学田乡", "太平乡", "九龙乡"],
23        ['东方红村', '东镇村']
24      ],
25 
26      objectMultiArray: [{
27 
28          "Town": "突泉镇",
29          "Country": "东方红村"
30 
31        },
32        {
33 
34          "Town": "突泉镇",
35          "Country": "东镇村",
36 
37        }, {
38 
39          "Town": "六户镇",
40          "Country": "六户村"
41 
42        }
43 
44 
45      ],
46 
47    },
48    onl oad: function () {
49      var that = this;
50 
51      wx.request({
52        url: 'https://jb.tq.gov.cn/Town_country/getData',
53        success: function (res) {
54 
55          that.setData({
56            objectMultiArray: res.data
57          });
58        }
59      })
60    },
61    bindMultiPickerChange: function (e) {
62          this.setData({
63        "multiIndex[0]": e.detail.value[0],
64        "multiIndex[1]": e.detail.value[1]
65      });
66    },
67    bindMultiPickerColumnChange: function (e) {
68      var that = this;
69      var xz = this.data.multiArray[0][e.detail.value] //记录当前选中的乡镇
70      switch (e.detail.column) {
71        case 0:
72          list = []
73          for (var i = 0; i < that.data.objectMultiArray.length; i++) {
74            if (xz == that.data.objectMultiArray[i].Town) {
75              list.push(that.data.objectMultiArray[i].Country)
76                        }
77          }
78          that.setData({
79            "multiArray[1]": list,
80            "multiIndex[0]": e.detail.value,
81            "multiIndex[1]": 0
82          })
83          
84      }
85    }
86 
87  })

标签：picker,Town,级联,程序,detail,multiIndex,var,data,objectMultiArray
来源： https://www.cnblogs.com/sunzzhankui/p/15359763.html

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

ICode9

小程序 级联 picker

小程序级联 picker