In HTML you can have <select> options which are disabled. The native picker for this is implemented on iOS in a way, that it automatically deselects a disabled item if the user tries to select it.
Is the same behavior also implemented for the react-native Picker?
I currently simply remove options from the picker instead of disabling them. This however results in confusing animations which I would like to avoid:
render() {
return (
<ScrollView showsVerticalScrollIndicator={false} >
<View>
{this.state.answers.map((obj, i) => (
<View key={i}>
<Picker
selectedValue={'question' in this.state.answers[i] ? this.state.answers[i].question : -1}
onValueChange={itemValue => this.setQuestion(i, itemValue)}
>
<Picker.Item label="-- pick a question --" value={-1} />
{
this.state.questions.map((question, j) => {
const alreadyPickedElswhere = this.state.answers.some(a => a.question === question.pk) && this.state.answers[i].question !== question.pk;
return (!alreadyPickedElswhere ? <Picker.Item label={question.text} value={question.pk} key={j} /> : null);
})
}
</Picker>
</View>))
}
</View>
</ScrollView>);
}
}
No, you cant deselect SelectedItem in case of Picker, rather you can select other option. But there is no way of what you expect from Picker of react-native. Either go with creating your own or other library.
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With