带有React钩子的React Native Picker组件:无法将Picker的值传递给父级

Question

我正在使用React Native的Picker组件进行选择。不幸的是，它不起作用；我无法将onValueChange的值向上传递给handleChangeCharacter。以下是我目前所拥有的：

const [characterIndex, selectCharacter] = useState('0')
const handleChangeCharacter = ({ e }) => {
console.log('e', e)
selectCharacter(e)
}
const cStyle = "Style: " + characters[characterIndex].cStyle
return (
<View style={styles.container}>
<View style={styles.header}>
<Picker selectedValue={characterIndex} onValueChange={handleChangeCharacter}>
{
characters.map((character, index) => {
return (
<Picker.Item label={character.name} value={index} key={index} />
)
})
}
</Picker>
...
...
...

我正在使用React Hook来设置"characterIndex"的值。不幸的是，"e"总是"未定义">

感谢您的帮助。

Answer 1

问题出在handleChangeCharacter中，您正在进行析构函数，但onValueChange没有传递属性为e的对象。文档

onValueChange-选择项目时的回调。这是用以下参数调用的：

itemValue：选择的项目的值道具

itemPosition：此选取器中所选项目的索引

// remove destructuring
const handleChangeCharacter = (value, index) => {
console.log('value', value, index) // equals to index which is set here value={index}
selectCharacter(value)
}