如何让react-native Picker停留在新选择的选项上？
如何让react-native Picker停留在新选择的选项上？
提问于 2016-06-03 00:46:21
我有一个选择器，现在我正在iOS上测试，有两个选项。每次我从第一个选项向下拖动到第二个选项时，选取器都会立即返回到第一个选项。
这是我的选择器代码的样子。
<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>我希望选择器停留在新滚动到的选项上。我还删除了selectedValue属性的|| 'a'部分，但这也没有解决问题。
回答 3
Stack Overflow用户
回答已采纳
发布于 2016-06-03 00:59:46
值更改时，需要指定状态的哪个属性已更改，并使用this.setState对其进行相应更改
onValueChange={(value) => {this.setState({pickerValue: value});完整代码
<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>Stack Overflow用户
发布于 2021-05-06 20:58:10
我只是偶然遇到了这个问题，并面临着同样的问题，滚动到新的项目并重置到第一个项目。我已经使用无状态组件(Hooks)做到了这一点：
我有一个对象的数组作为值，选项作为键
const data = useState({
"options":[{
"name":"Dish 1","price":0},{"name":"Dish 2","price":0}]})const [selected, setSelected] = useState(0)
Picker组件：
<PickerIOS
selectedValue={selected_choice}
onValueChange={(value, index) => {
set_selected_choice(index)
}}
>
{data?.map((item, index) => (
<PickerIOS.Item
key={item}
value={index}
label={item.name}
/>
))}
</PickerIOS>在这里，我存储了处于选中状态的数组元素的索引，并从PickerIOS项更新了它，将值保留为索引。
Stack Overflow用户
发布于 2017-09-18 02:58:33
我使用了这个"hack"：
render() {
const values = ['1', '2'];
return (
<Picker
value={this.state.value}
onValueChange={this.onValueChange.bind(this)}
>
{
<Picker
value={this.state.value}
onValueChange={this.onValueChange.bind(this)}
>
{
[<Picker.Item
label="n/a"
value={null}
/>].concat(values.map(value => {
return (
<Picker.Item
label={value}
value={value}
/>
)
})
)
}
</Picker>
);
}页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/37597665
复制相关文章
相似问题
腾讯云开发者
