|
導讀微信小程序,簡稱小程序,英文名Mini Program,是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或搜一下即可打開應用。小程序是一種不用下載就能使用的應用,也是一... 微信小程序,簡稱小程序,英文名Mini Program,是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或搜一下即可打開應用。小程序是一種不用下載就能使用的應用,也是一項門檻非常高的創新,經過將近兩年的發展,已經構造了新的小程序開發環境和開發者生態。 這篇文章主要為大家詳細介紹了微信小程序多列選擇器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多列選擇器的使用示例的詳細內容,更多請關注php中文網其它相關文章! 小程序是一種不需要下載安裝即可使用的應用,它實現了應用“觸手可及”的夢想,用戶掃一掃或者搜一下即可打開應用。 |
溫馨提示:喜歡本站的話,請收藏一下本站!