How to change the Placeholder text for when Items are selected

[parsa-j42]

I have a DropDownPicker component with multiple={true}. I know I can use the placeholder property to change the placeholder text, But when I select an item (or more) in the dropdown, the text changes to "An item has been selected" or "(number) items have been selected".

How can I change the placeholder's text in these situations? Or is there any option, so I can keep the placeholder static, so it doesn't change when I select the items?

[vinaynarayankutty]

@parsa-j42 Any update on this ? In my case multiple selection is turned off. I just want to change the label after selecting an item.

[parsa-j42]

@vinaynarayankutty Nope.

[medsabbar]

you add the multipleText to your component <DropDownPicker multipleText={'some text'} />

[mariusgaciu]

you add the multipleText to your component <DropDownPicker multipleText={'some text'} />

Nice one, but is there a way to set it as one text when only one item is picked and a second text when multiple items are picked? Example: One day has been selected when one item is selected {count} days have been selected when more than one item selected

[amandaO2hess]

@mariusgaciu you can use variables and many ternary condition inside multipleText, using the length of value you can achieve what you want like this:

multipleText={${value.length} ${value.length == 1 ? 'day' : 'days' } has been selected}

[medsabbar]

you add the multipleText to your component <DropDownPicker multipleText={'some text'} />

Nice one, but is there a way to set it as one text when only one item is picked and a second text when multiple items are picked? Example: One day has been selected when one item is selected {count} days have been selected when more than one item selected

multipleText={multiple && ${selectValue.length} ${t('selected')}} Based on the selected values length you can chain your condition I usually just show the count, and below the select component I show all the selected values if needed like so

{multiple && ( <Text style={{ fontSize: 18, fontStyle: 'italic' }}>{*${selectValue .map(v => { const item = items.find(i => i.value === v); return item ? item.label : ''; }) .join(', ')}}</Text> )}

[mariusgaciu]

@amandaO2hess @medsabbar Than you for the solutions provided.