今天用小程序的picker组件时，遇到遇到了picker组件的坑，相信很多不仔细
看官方文档的同学们也会遇到，这里就简单记录下：
官方文档上写了value是下标不是值；
| value | Number | 0 | value 的值表示选择了 range 中的第几个（下标从 0 开始） |
官方提供的例子：
console
.log
(
'picker发送选择改变，携带值为'
, e
.detail
.value
)
打印结果如下：
官方这里有个误导，携带值让第一眼看到的人都以为这里
e.detail.value就是选中项的值，其实只是选中项的下标；
那么如何才能打印出值呢？
下面提供几种方法：
xml:
<
view
class=
"section"
>
<
view
class=
"section__title"
>普通选择器
</
view
>
<
picker
bindchange=
"bindPickerChange"
value=
"{{index}}"
range=
"{{array}}"
>
<
view
class=
"picker"
>
当前选择：{{array[index]}}
</
view
>
</
picker
>
</
view
>
js:
data
:
{
array
:
[
'夏彤'
,
'陈学华'
,
'甘广'
,
'黄龙流'
,
'李昌略'
,
'董俊辉'
,
'罗景盛'
,
'钟敏君'
,
'林锐'
,
'麦健发'
,
'曹兵'
],
objectArray
:
[
{
id
:
0
,
name
:
'夏彤'
},
{
id
:
1
,
name
:
'陈学华'
},
{
id
:
2
,
name
:
'甘广'
},
{
id
:
3
,
name
:
'黄龙流'
},
{
id
:
4
,
name
:
'李昌略'
},
{
id
:
5
,
name
:
'董俊辉 '
},
{
id
:
6
,
name
:
'罗景盛'
}
,
{
id
:
7
,
name
:
'钟敏君'
}
,
{
id
:
8
,
name
:
'林锐'
}
,
{
id
:
9
,
name
:
'麦健发'
}
,
{
id
:
10
,
name
:
'曹兵'
}
]
关键是这个函数：
方法1：
bindPickerChange
:
function
(e
)
{
var index
=
this
.data
.index //记得要声明的，不然打印是undifind
console
.
log
(
'picker发送选择改变，携带下标为'
,
e
.
detail
.
value
)
console
.log
(
'picker发送选择改变，携带值为'
,
this
.data
.array
[index
])
this
.setData
({
index
: e
.detail
.value
})
},
方法2：
bindPickerChange
:
function
(e
)
{
console
.log
(
'picker发送选择改变，携带下标为'
, e
.detail
.value
)
console
.log
(
'picker发送选择改变，携带值为'
,
this
.data.array
[e
.detail
.value
])
this
.setData
({
index
: e
.detail
.value
})
},
打印结果如下：
e；detail.v