如何将密钥检索到语义用户界面反应下拉列表中？

Question

我对react下拉菜单有一个小问题。

我可以提取下拉列表中的值，但是我也需要密钥，因为我的页面用于销售东西。因此，这是一个关联表，我需要每个表的ID来进行查询 INNERJOIN 。

这是我填写的方式：

let options_customers = [];

serviceList[0].map((service, i) =>
                    options_customers.push({ 
                        key: service.Id, 
                        text: service.Name, 
                        value: service.Name 
                     })) 

我的下拉列表：

  <Dropdown 
    selection options={options_customers} 
    onChange={this.handleChange} 
    value={value} key={options_customers.key} 
    name="selectCustomer" placeholder='Select Customer' 
  />

Answer 1

您可以使用在value到data函数中获得的onChange来选择正确的选项并从中获取密钥：

handleChange(event, data) {
  const { value } = data;
  const { key } = data.options.find(o => o.value === value);
}

Answer 2

我正在提供反馈和已完成的更新：

第一：

<Dropdown selection options={options_customers} onChange={this.handleChange} name="selectCustomer" placeholder='Select Customer' /><br />

在之前的代码中，我有value = {value}和key = {options_customers.key}

第二，在我的handleChange中，我实现了您的示例，现在它可以正常工作了 非常感谢！

已升级他的解决方案，请在顶部查看