<SelectDropdown
data={selected}
onSelect={(selectedItem, index) => {
console.log(selectedItem, index)
}}
buttonTextAfterSelection={(selectedItem, index) => {
// text represented after item is selected
// if data array is an array of objects then return selectedItem.property to render after item is selected
return selectedItem
}}
rowTextForSelection={(item, index) => {
// text represented for each item in dropdown
// if data array is an array of objects then return item.property to represent item in dropdown
return item
}}
/>
You are passing an array of objects, to render a title for the button after selection use return selectedItem.value and for each row use return item.value
const [selected, setSelected] = useState([ { key: 1, value: 'PieChart' }, { key: 2, value: 'Table' }, ])
<SelectDropdown data={selected} onSelect={(selectedItem, index) => { console.log(selectedItem, index) }} buttonTextAfterSelection={(selectedItem, index) => { // text represented after item is selected // if data array is an array of objects then return selectedItem.property to render after item is selected return selectedItem }} rowTextForSelection={(item, index) => { // text represented for each item in dropdown // if data array is an array of objects then return item.property to represent item in dropdown return item }} />