官方是這樣描述picker的
1、range 主要指服務端返回的數據集（也可自定義數據），類型為Array。
2、value 主要指range數組的下標，類型為Number。
3、bindchange 主要指改變選項時觸發的事件。其中event.detail.value可獲取自身value的值。
1、由于range屬性值為整個下拉選項的數據集及value為range的下標，所以要顯示當前選項即：{{array[index]}}。
2、下拉選項彈層的樣式為底部彈出，如下圖。
picker通過form提交的時候，肯定提交的是自己的value，那么就相當于永遠提交的是0、1、2、3、4、5…… 這樣的話問題就來了，咱們要這些個0123有個毛用？例如服務端返回這樣的數據：
show_arr = [ //定義假數據
{ “id” : “a6745” , “name”:”Bill” },
{ “id” : “b4433” , “name”:”George” },
{ “id” : “c5674” , “name”:”Thomas” },
{ “id” : “d5543” , “name”:”jack” },
{ “id” : “e7554” , “name”:”tim” }
];
這樣每次選擇名字之后，我想提交的是對應的id。例如選擇jack那么我想傳遞d5543,這個是我們想要的，可是現在總給我們返回012345……這是什么鬼？？？
id:{{item.id}}===>name:{{item.name}}
請選擇
{{picker_arr[picker_index]}}
form提交
結果為：{{result}}
css代碼：
#show{
text-align:center;
font-size:60rpx;
display:block;
color:#fff;
background-color:green;
padding:10rpx0;
}
.selected{
background-color:pink;
}
.submit{
background-color:yellow;
}
.result{
background-color:red;
}
js代碼：
Page({
data:{
show_arr:[],//展示所有假數據
picker_arr:[],//picker中range屬性值
picker_index:0,//picker中value屬性值
id_arr:[],//存儲id數組
result:''//form提交最終結果
},
onLoad:function(options){
varpicker_arr=[],
id_arr=[],
show_arr=[//定義假數據
{"id":"a6745","name":"Bill"},
{"id":"b4433","name":"George"},
{"id":"c5674","name":"Thomas"},
{"id":"d5543","name":"jack"},
{"id":"e7554","name":"tim"}
];
show_arr.forEach(function(e){
picker_arr.push(e.name);
id_arr.push(e.id);
})
this.setData({show_arr:show_arr,picker_arr:picker_arr,id_arr:id_arr});
},
bindPickerChange:function(e){//選項改變觸發事件
this.setData({
picker_index:e.detail.value
})
},
formSubmit:function(e){//表單提交觸發事件
varresult=this.data.id_arr[e.detail.value.selector];
this.setData({result:result});
}
})
原文地址：表單組件Form提交之蛋疼的___picker普通選擇器模式-微信小程序俱樂部 www.wxappclub.com
轉載于：http://www.wxappclub.com/topic/687
