Typescript React <Select> onChange handler type error
Since MUI Select in not a real select element you will need to cast e.target.value
using as Type
and type the handler as React.ChangeEvent<{ value: unknown }>
const handleCountryChange = (event: React.ChangeEvent<{ value: unknown }>) => {
setValues({...values, country: event.target.value as string});
};
Seemed counterintuitive for me either, but I had to do this:
const handleChange = (e: ChangeEvent<{ value: string | unknown }>) => formik.setFieldValue('field', e.target.value)
This is proper for the latest MUI 5 / Select
import { SelectChangeEvent } from "@mui/material";
const handleOnChange = (event: SelectChangeEvent<unknown>) => {
const value = event.target.value as YourEnumType;
};