从对象数组设置 DropDown 值

Question

这是从 WebAPI 获取并存储在称为 items 的状态中的数据

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

项目的这种状态将是这样。

[
    {"departmentName":"KYAUKSE MAINTENANCE","employeeName":"AUNG THU1", "staffId" : "00001"},
    {"departmentName":"KYAUKSE MAINTENANCE","employeeName":"AUNG THU2", "staffId" : "00002"},
    {"departmentName":"KYAUKSE MAINTENANCE","employeeName":"AUNG THU3", "staffId" : "00003"}
]

我想用 emplyeeName 在本机反应中创建一个下拉列表

let staff = [{
      value: 'AUNG THU1',
    }, {
      value: 'AUNG THU2',
    }, {
      value: 'AUNG THU3',
    }];

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

编辑：谢谢你的回答！ 我想知道是否可以在DropDown中获取所选值的staffId？ 因此，如果我要选择AUNG THU 1 ，则 onChange 方法将触发，我想将 staffId 的状态设置为它。

Answer 1

如果你想改变你的阵列，试试下面的方法

let dataSource = [
  { departmentName: "KYAUKSE MAINTENANCE", employeeName: "AUNG THU1" },
  { departmentName: "KYAUKSE MAINTENANCE", employeeName: "AUNG THU2" },
  { departmentName: "KYAUKSE MAINTENANCE", employeeName: "AUNG THU3" }
];

let staff = dataSource.map(item => ({
  value: item.employeeName,
  staffId: item.staffId
}));

console.log(staff);

希望这对你有帮助。 如有疑问，请放心。

Answer 2

仔细检查您的下拉组件。 它可能需要一个同时具有键和值的数据数组。

let staff = [{
  key: 'AUNG THU1',
  value: 'AUNG THU1'
}, {
  key: 'AUNG THU2',
  value: 'AUNG THU2'
}, {
  key: 'AUNG THU3',
  value: 'AUNG THU3'
}];