Do we have the option to delete the selection somehow?

[ToppantoB]

Resetting the "selected" to an empty string doesn't do the trick. Maybe I missed something.

[danish1658]

setSelected ('')

[ToppantoB]

That set's the selected's value back to "empty", but the dropdown will still display the last selected element. It will not go back to the original placeholder text.

[danish1658]

No it will show the placeholder text

[ToppantoB]

This is my code snippet, am I messing something up here?

const [selected, setSelected] = useState("");
...
const saveWork = () => {
        saveWork();
        setSelected('');
   };
...
<View style={styles.container}>
   ...
   <SelectList
      boxStyles={styles.dropDown}
      dropdownStyles={styles.dropDown}
      setSelected={(val: string) => setSelected(val)}
      data={dropdownData}
      save="key"
   />
   ...
</View>

Calling the saveWork calls the setSelected('') , but the dropdown is not reset to the placeholder text. (see the gif I attached)

Also, how should the component even know that the selected was reset? We never pass the value of the selected variable to it.

[danish1658]

I will reply you with an expo snack shortly

[DavidPurcell1973]

I will reply you with an expo snack shortly

I having the same issue did this get resolved?

[ToppantoB]

Not yet, I'm still waiting for the expo snack from @danish1658

[akruz97]

Todavía no, sigo esperando la merienda de la expo de@danish1658

Estaba en lo mismo y lo solucione, estableciendo un objeto para defaultOption ` const DEFAULT_OPT = { key: 0, value: 'Seleccione una opción'} const [defaultOption, setDefaultOption ] = useState(DEFAULT_OPT);

const saveWork = () => { saveWork(); setSelected(''); setDefaultOption(DEFAULT_OPT); };

<SelectList defaultOption={defaultOption} boxStyles={styles.dropDown} dropdownStyles={styles.dropDown} setSelected={(val: string) => setSelected(val)} data={dropdownData} save="key" /> `

[debapriy0]

I tried to modify a few lines, see if this helps you

• change 1 const MultipleSelectList: React.FC<MultipleSelectListProps> = React.forwardRef((props,ref) => {
• change 2 React.useImperativeHandle(ref,()=>({ resetSelectedData, setSelectedData })) const resetSelectedData = () => { setSelectedVal("") setFilteredData(data) _setFirstRender(false); } const setSelectedData = (val) => { let selectedValue = data?.filter((item:any)=>{ if(val?.includes(item.key)){ return {value: item.value} } }).map((item:any)=>{return item.value}) setSelectedVal(selectedValue) } ...rest of the code })

and you can use this resetSelectedData, setSelectedData two functions with ref.

[faisalaltell12]

How is this done with MultipleSelectList? I basically want to reset all selected items. I set the state to an empty array. It still displays in the UX some selected items.

[ITyukz11]

any update?