web-dev-qa-db-fra.com

Comment faire en sorte que Picker natif réagisse à l'option nouvellement sélectionnée?

J'ai un sélecteur que je teste actuellement sur iOS avec deux options. Chaque fois que je fais glisser la première option vers la deuxième option, le sélecteur revient immédiatement à la première option.

Voici à quoi ressemble le code de mon sélecteur.

<Picker 
      style={{
        width: 100,
      }}
      selectedValue={(this.state && this.state.pickerValue) || 'a'}
      onValueChange={(value) => {
        this.setState({value});
      }} itemStyle={{color: 'white'}}>
      <Picker.Item label={'Hello'} value={'a'} />
      <Picker.Item label={'World'} value={'b'} />
</Picker>

Je veux que le sélecteur reste sur l'option nouvellement défilée. J'ai également supprimé le || 'a' partie de l'attribut selectedValue mais cela n'a pas non plus résolu le problème.

javascriptiosreactjsreact-native
15
zavtra

Lors d'un changement de valeur, vous devez spécifier quelle propriété de l'état a changé et la modifier en conséquence avec this.setState

onValueChange={(value) => {this.setState({pickerValue: value});

Code complet

<Picker 
      style={{
        width: 100,
      }}
      selectedValue={(this.state && this.state.pickerValue) || 'a'}
      onValueChange={(value) => {
        this.setState({pickerValue: value});
      }} itemStyle={{color: 'white'}}>
      <Picker.Item label={'Hello'} value={'a'} />
      <Picker.Item label={'World'} value={'b'} />
</Picker>
26
Nakib