I am using react-select package but when i click on clearable cross-icon it gives me error
Cannot read properties of undefined (reading 'value')
<Select
className="form_control_country"
isClearable
onChange={onChangeStateHandler}
defaultValue={null}
disabled={navigationResponse != null ? true : false}
options={stateOptions}
placeholder={""}
></Select>
this is onChange function
const onChangeStateHandler = (e) => {
setSelectedState(e.target.value);
};
The parameter of onChange callback is the new value (or values) of the select, not DOM event like standard select.
So you should be able to get the value directly:
const onChangeStateHandler = (newOption) => {
// newOption can also be null
setSelectedState(newOption?.value);
};
I'm assuming your options has a value property.
Looking at the TypeScript types it is clear
onChange: (
newValue: OnChangeValue<Option, IsMulti>,
actionMeta: ActionMeta<Option>
) => void;