Question

我已经使用了反应选择器并将其重置为以前的值。OValueChange上的setState也不起作用

pickerChange(index) {
  this.setState({
     ingred_value: this.props.filterData.ingredients[index].value,
     ingred_id: this.props.filterData.ingredients[index].id
});

<Picker
  mode='dropdown'
  selectedValue={this.state.ingred_value}
  style={{ marginStart: 10 }}
  onValueChange={(itemIndex) => this.pickerChange(itemIndex)}
>

 {
   this.props.filterData.ingredients.map((v) => 
   {
     return <Picker.Item label={v.value} value={v.id} key={v.id} />
   })
 }
</Picker>

Answer 1

您的代码有2个潜在问题：

您的selectedValue组件的Picker属性设置为this.state.ingred_value（其中包含的值不是id），而是{{1}的value属性}组件设置为PickerItem。这意味着，当您更改v.id状态值时，Picker将无法将新状态与PickerItem中的ID值进行匹配，以在ingred_value中进行选择。您应该改用selectedValue。
ingred_id方法的第一个参数是值（v.id），而不是所选项目的索引（请看here）。因此，除非您的项目ID从0开始并且是连续的，否则它可能与索引不匹配，在这种情况下，您将不会在数组（onValueChange）中选择正确的项目，如果该项目ID不存在。您应该将其更改为ingredients[index]。

下面的代码应该可以工作：

onValueChange={(itemValue, itemIndex) => this.pickerChange(itemIndex)}

更改值后，React Native Picker重置

1 个答案: