如何在選項中傳遞額外的鍵來 react-dropdown 並從 onChange 道具中取回它們？

Question

我正在使用這個下拉庫react-dropdown

export const currencies = [
    { value: 'USD', label: '$ USD', currencySign: "$" },
    { value: 'INR', label: '₹ INR', currencySign: "₹" },
    { value: 'CAD', label: 'C$ CAD', currencySign: "C$"  }
]


<Dropdown 
    options={currencies}
    onChange={newSelectedOption => console.log(newSelectedOption)} // Getting an object with only 2 keys: "label" & "value". The third key "currencySign" is not there!
/>

有什么辦法可以在那個 onChange 對象中獲得“currencySign”？

謝謝！

2020 年 10 月 13 日更新：似乎 react-dropdown 庫不提供此功能。

Answer 1

react-dropdown庫似乎沒有帶來該功能，但您可以在onChange函數中執行以下操作：

const selectedCurrency = currencies.find({value, label} => value === newSelectedOption.value && label === newSelectedOption.label)

然后你可以檢索currencySign屬性

Answer 2

如果您可以訪問處理程序中的選項數組，則可以編寫一個輔助函數

Dropdown 
    options={currencies}
    onChange={onChange}
/>

onChange(selected){
  var itemWithCurrency = this.findSelected(selected.value,  this.currencies)
}

findSelected(value, items){
  return items.find(item => item.value === value)
}