如何让react-native Picker保持新选择的选项？

I have a picker that I'm testing on iOS right now with two options. Every time I drag down from the first option to the second option, the picker immediately returns to the first option.

我有一个我正在iOS上测试的选择器,有两种选择。每次我从第一个选项向下拖动到第二个选项时,选择器会立即返回第一个选项。

This is what my the code for my picker looks like.

这就是我的选择器代码的样子。

<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>

I want the selector to stay at the newly scrolled-to option. I've also removed the || 'a' part of the selectedValue attribute but that didn't solve the issue either.

我希望选择器保持在新滚动的选项中。我也删除了|| selectedTalue属性的'a'部分,但也没有解决问题。

2 个解决方案

#1

On value change you need to specify which property of the state changed and change it accordingly with this.setState

在值更改时,您需要指定状态的哪个属性已更改,并使用this.setState相应地更改它

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

Complete Code

<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>

2 个解决方案

#1

更多相关文章

随机推荐