這篇文章給大家分享的是有關微信小程序中range-key多列選擇器怎么用的內容。小編覺得挺實用的,因此分享給大家做個參考,一起跟隨小編過來看看吧。
成都創新互聯堅持“要么做到,要么別承諾”的工作理念,服務領域包括:網站建設、成都網站建設、企業官網、英文網站、手機端網站、網站推廣等服務,滿足客戶于互聯網時代的豐滿網站設計、移動媒體設計的需求,幫助企業找到有效的互聯網解決方案。努力成為您成熟可靠的網絡建設合作伙伴!
微信小程序多列選擇器的具體代碼,具體內容如下
<picker mode="multiSelector" bindchange="bindMultiPickerChange2" bindcolumnchange="bindMultiPickerColumnChange2" value="{{multiIndex}}" range="{{objectMultiArray}}" range-key="{{'name'}}"> <view class="picker"> 當前選擇:{{objectMultiArray[0][multiIndex2[0]].name}},{{objectMultiArray[1][multiIndex2[1]].name}} </view> </picker>
Page({ /** * 頁面的初始數據 */ data: { objectMultiArray: [ [ { id: 0, name: '無脊柱動物' }, { id: 1, name: '脊柱動物' } ], [ { id: 0, name: '扁性動物' }, { id: 1, name: '線形動物' }, { id: 2, name: '環節動物' }, { id: 3, name: '軟體動物' }, { id: 3, name: '節肢動物' } ] ], multiIndex2: [0, 0], }, bindMultiPickerChange2: function (e) { console.log('picker發送選擇改變,攜帶值為', e.detail.value) this.setData({ multiIndex2: e.detail.value }) }, bindMultiPickerColumnChange2: function (e) { console.log('修改的列為', e.detail.column, ',值為', e.detail.value); var data = { objectMultiArray: this.data.objectMultiArray, multiIndex2: this.data.multiIndex2 }; data.multiIndex2[e.detail.column] = e.detail.value; switch (e.detail.column) { case 0: switch (data.multiIndex2[0]) { case 0: data.objectMultiArray[1] = [ { id: 0, name: '扁性動物' }, { id: 1, name: '線形動物' }, { id: 2, name: '環節動物' }, { id: 3, name: '軟體動物' }, { id: 3, name: '節肢動物' } ]; // data.multiArray[2] = ['豬肉絳蟲', '吸血蟲']; break; case 1: data.objectMultiArray[1] = [ { id: 0, name: '魚' }, { id: 1, name: '線形兩棲動物' }, { id: 2, name: '爬行動物' } ]; break; } data.multiIndex2[1] = 0; // data.multiIndex[2] = 0; break; } this.setData(data); } })
感謝各位的閱讀!關于“微信小程序中range-key多列選擇器怎么用”這篇文章就分享到這里了,希望以上內容可以對大家有一定的幫助,讓大家可以學到更多知識,如果覺得文章不錯,可以把它分享出去讓更多的人看到吧!
分享題目:微信小程序中range-key多列選擇器怎么用
網站URL:http://vcdvsql.cn/article44/jhghee.html
成都網站建設公司_創新互聯,為您提供靜態網站、電子商務、網站制作、定制開發、網站設計公司、用戶體驗
聲明:本網站發布的內容(圖片、視頻和文字)以用戶投稿、用戶轉載內容為主,如果涉及侵權請盡快告知,我們將會在第一時間刪除。文章觀點不代表本網站立場,如需處理請聯系客服。電話:028-86922220;郵箱:631063699@qq.com。內容未經允許不得轉載,或轉載時需注明來源: 創新互聯