当值为真时显示选择器项 反应本机.

Question

我有一个组件，它使用来自'react-native'的Picker，在道具中，我收到布尔值showDefaultPickerItem来显示或隐藏Picker.Item。问题是这样做不起作用，我收到错误

null 不是评估子道具的对象

可以肯定的是，list的长度比 1 长。

function PickerComponent(props){
const { selectedValue, onValueChange, list, label, valuekey, showDefaultPickerItem } = props;
return (
<Picker
selectedValue={selectedValue}
onValueChange={(value) => onValueChange(value)}
>
{showDefaultPickerItem &&
<Picker.Item label={"Select"} value={undefined} color ={gray}/>    
}
{list.map(l => {
return <Picker.Item key={l[valuekey]} label={l[label]} value={l[valuekey]} />
})
}
</Picker>              
)
}

Answer 1

我认为这段代码对您很有帮助。

function make_list(list, showDefaultPickerItem, valuekey, label) {
let listMap = list.map(l => <Picker.Item key={l[valuekey]} label={l[label]} value={l[valuekey]} />);
if (showDefaultPickerItem) {
listMap.unshift(<Picker.Item key="_default" label={"Select"} value={undefined} color={'gray'} />);
}
return listMap;
}
function PickerComponent(props){
const { selectedValue, onValueChange, list, label, valuekey, showDefaultPickerItem } = props;
return (
<Picker
selectedValue={selectedValue}
onValueChange={(value) => onValueChange(value)}
>
{make_list(list, showDefaultPickerItem, valuekey, label)}
</Picker>              
)
}