官方是这样描述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
