React Native: как получить данные из State с вложенным массивом json и отобразить это состояние, чтобы получить определенное значение с заданным идентификатором

Question

У меня есть встроенный сборщик реагирования, в котором есть массив объектов, которые я извлек из моего API и сохранил в состояние в свойствах. Это скриншот полученных данных

Мне нужно найти правильный объект в массиве из _id при выборе раскрывающегося списка свойств. Мне нужно, чтобы это было сделано с помощью Javascript logi c без повторного вызова на мой сервер. Это мой код внутри рендера для выпадающего списка

 <View style={{margin: 20, flexDirection: 'row', flex: 1}}>
                        {/*PROPERTY....................................................*/}
                        <View style={{padding: '10px'}}>
                            <Picker style={styles.picker} selectedValue={this.state.pickerProperty}
                                    onValueChange={(itemValue, itemIndex) => this.getPropertyById(itemValue)}>
                                <Picker.Item label="Select Property" value=""/>
                                {this.state.properties.map((item, key) => (
                                    <Picker.Item label={item.PropertyName} value={item._id} key={key}/>
                                ))}
                            </Picker>
                            {/*{this.getPropertyById()}*/}
                        </View>
                        {/*TYPE........................................................*/}
                        <View style={{padding: 10}}>
                            <Picker style={styles.picker} selectedValue={this.state.pickerType}
                                    onValueChange={(itemValue, itemIndex) => this.setState({pickerType: itemValue})}>
                                <Picker.Item label="Select Type" value=""/>
                                {this.state.propById.map((item, key) => (
                                    <Picker.Item label={item.tname} value={item.tname} key={key}/>
                                ))}

                            </Picker>
                            <Text>{this.state.pickerType}</Text>
                        </View>
                    </View>

Мне нужно написать свой код внутри этой функции

 getPropertyById=(itemValue)=> { //Need the code here
}

Answer 1

Попробуйте это

const getPropertyById = (propertiesArray, itemValue) => {
     return propertiesArray.find(item => item._id === itemValue)
}

Назовите это так внутри onValueChange:

this.getPropertyById(this.state.properties, itemValue)

Answer 2

Нашел это решение, и оно мне помогло.

    changeProperty(event) {
    this.setState({selectedProperty: event.target.value});
    this.setState({types: this.state.properties.find(property => property.PropertyName === event.target.value).Type})

}

changeType(event) {
    this.setState({selectedType: event.target.value});
    const Ty = this.state.properties.find(property => property.PropertyName === this.state.selectedProperty).Type;
    this.setState({items: Ty.find(Typ => Typ.typename === event.target.value).Item})

}

Использование каждого из них в onChange = {} каждого раскрывающегося списка решит проблему. Не забудьте изменить ваш конструктор следующим образом

   constructor(props) {
    super(props);
    this.changeProperty = this.changeProperty.bind(this);
    this.changeType = this.changeType.bind(this);

}

Answer 3

this.setState({
  pickerProperty : this.state.properties.find(item => item._id === itemValue)
})

или как функция

getPropertyById(itemValue) {
  this.setState({
    pickerProperty : this.state.properties.find(item => item._id === 
    itemValue)
  })
}