Associate an id with each item listed in a Select component?

[devstc]

I'm pulling the content for the Select data prop from a database. So far I've only passed in an array of plain text strings, but now I want to be able to pass in and then capture an id associated with the item the user selected. Can this be done through the data prop, or is there some other way it has to be done (if it can be)?

[rtivital]

You can use data prop in the following format: [{ value: 'value-1', label: 'label-1' }, { value: 'value-2', label: 'label-2' }], value in this case will be your id

[devstc]

Thanks Vitaly! This is one case where the naming matters... you must use 'label' and 'value' specifically when passing to the data prop. I tried my own naming and it didn't work.

Honestly, I still don't know how this works... I would have thought I would have needed to use a form of dot notation to access the value, but I did this for the onChange... onChange={(event) => {handleSetCurrent(event)... and in the function accessed 'event' and it WAS the value straight away. I didn't have to do any gymnastics to get to it. Again, I don't know why accessing just the event like that gives just the value and you don't have to do anything special to get to it. Sometimes you just try a thing and it works. I'll not worry about the why for now and just accept that it works!

Thanks again, Vitaly. I really appreciate how involved you are in this discussion forum. So helpful!