将多个参数传递给选取器下拉列表中的 Onchange

Question

  let makeSubfuel =this.state.data.map((subfuel) => 
  {
     return <Picker.Item label= {subfuel.name} value= {subfuel.id} key= {subfuel.price}/>
  })

  <Form>
    <Picker style={{ width :'90%' ,borderRadius: 10,borderWidth: 3,borderColor: 'black'}}
            mode="dropdown"
            selectedValue={this.state.subfuelid}
            onValueChange={(value,key,label) =>
            {                   
                this.setState({subfuelid: value})
                //ToastAndroid.show("models id is "+ value+"price "+price+"label.."+label, ToastAndroid.LONG);
            }
            }>
    <Picker.Item label="Select Fuel Type" value="key0" />
            {makeSubfuel}
    </Picker>
  </Form>

在上面的代码中，我正在从服务器获取数据并显示在下拉选择器中。我存储了子燃料的ID名称和价格，同时为下拉菜单标签制作了项目。现在单击我想知道所有三个值，即特定条目的 id 名称和价格，但它显示未定义的名称和相同的价格和值值。为什么？我在这里做错了什么？

Answer 1

从文档中，ValueChange 在其背面返回值和索引。 https://facebook.github.io/react-native/docs/picker

onValueChange={(itemValue, itemIndex) => { 
  //do something here 
}

如果要获取键、值和标签，则应从提供给选取器的数据中查找它们。您应该能够将索引与此一起使用。

尽管您包含的数据中未包含的初始选取器项，但您可能必须将索引调整 1 才能访问正确的值。

onValueChange={(itemValue, itemIndex) => { 
  let item = this.state.data[itemIndex]
  // now do something here 
}