Получение 2 значений из массива объектов

Question

Я хотел бы выбрать элемент из выпадающего списка и установить для него состояние staffId. Я бы хотел, чтобы в раскрывающемся меню отображалось имя, но после того, как я выбрал имя, присваиваем штатному идентификатору штата. Я также хотел бы добиться этого без жесткого кодирования значений в if-else l oop, поскольку у меня есть тысячи данных для работы.

Это данные, извлеченные из WebAPI и сохраненные в состоянии, называемом элементами

this.setState({
    items: dataSource
  staffId: ''
})

Это состояние предметов будет таким.

[
    {"departmentName":"HOUSE","employeeName":"TEST1", "staffId" : "00001"},
    {"departmentName":"HOUSE","employeeName":"TEST2", "staffId" : "00002"},
    {"departmentName":"HOUSE","employeeName":"TEST3", "staffId" : "00003"}
]

Я создал раскрывающийся список в реагировать нативно только с emplyeeName. Я использую response-native-material-dropdown для библиотеки. Я хотел бы показать employeeName, но когда пользователь выбирает имя, вместо этого получает идентификатор

let staff = this.state.listOfEmployees.map(item => ({
        value: item.employeeName
        staffId: item.staffId
      }));

<Dropdown
    label='Staff Name'
    baseColor='#0079b5'
    data={staff}
    selectedValue={value}
    onChangeText={(staffId) => this.onChangeName(staffId)}
/>

Здесь, в этой функции, я хотел бы установить статус staffId для staffId выбранного значение.

onChangeName = (staffId) => {
    //set the state of staffId to the staffId of the selected value.
    //For Example, if AUNG THU 1 is selected, the state of staffId is '00001'.
    this.setState({
       staffId: staffId
    })
}

Answer 1

Вы можете сделать это, используя реквизиты valueExtractor и labelExtractor. Должно выглядеть примерно так:

<Dropdown
  label='Staff Name'
  baseColor='#0079b5'
  data={staff}
  selectedValue={value}
  valueExtractor={({ staffId }) => staffId}
  labelExtractor={({ employeeName }) => employeeName}
  onChangeText={(staffId) => this.onChangeName(staffId)}
/>