微信小程序多列選擇器range-key使用詳解
更新時間:2020年03月30日 15:06:22 作者:Rolan
這篇文章主要為大家詳細介紹了微信小程序多列選擇器range-key的使用方法,文中示例代碼介紹的非常詳細,具有一定的參考價值,感興趣的小伙伴們可以參考一下
本文實例為大家分享了微信小程序多列選擇器的具體代碼,供大家參考,具體內(nèi)容如下
<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({ /** * 頁面的初始數(shù)據(jù) */ data: { objectMultiArray: [ [ { id: 0, name: '無脊柱動物' }, { id: 1, name: '脊柱動物' } ], [ { id: 0, name: '扁性動物' }, { id: 1, name: '線形動物' }, { id: 2, name: '環(huán)節(jié)動物' }, { id: 3, name: '軟體動物' }, { id: 3, name: '節(jié)肢動物' } ] ], multiIndex2: [0, 0], }, bindMultiPickerChange2: function (e) { console.log('picker發(fā)送選擇改變,攜帶值為', 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: '環(huán)節(jié)動物' }, { id: 3, name: '軟體動物' }, { id: 3, name: '節(jié)肢動物' } ]; // 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); } })
請記得點贊額!?。?/p>
為大家推薦現(xiàn)在關注度比較高的微信小程序教程一篇:《微信小程序開發(fā)教程》小編為大家精心整理的,希望喜歡。
以上就是本文的全部內(nèi)容,希望對大家的學習有所幫助,也希望大家多多支持腳本之家。
相關文章
瀏覽器環(huán)境下JavaScript腳本加載與執(zhí)行探析之defer與async特性
defer和async特性相信是很多JavaScript開發(fā)者"熟悉而又不熟悉"的兩個特性,從字面上來看,二者的功能很好理解,分別是"延遲腳本"和"異步腳本"的作用2016-01-01JS選中checkbox后獲取table內(nèi)一行TD所有數(shù)據(jù)的方法
這篇文章主要介紹了JS選中checkbox后獲取table內(nèi)一行TD所有數(shù)據(jù)的方法,涉及javascript針對table元素遍歷與獲取的技巧,需要的朋友可以參考下2015-07-07