Encountering an error that says: TypeError: Cannot read properties of null (reading 'persist')
useEffect(() => {
if (edit) {
console.log(item)
setValues(item!);
}
document.body.style.overflow = showModal ? "hidden" : "";
// eslint-disable-next-line react-hooks/exhaustive-deps
}, [edit, showModal]);
const formik = useFormik({
initialValues: {
id: null as string | number | null,
brandDescription: "",
brandShortDescription: "",
imagePath: null as string | number | null,
statusDescription: false,
},
validationSchema: Yup.object({}),
onSubmit: async (values, helpers) => {
const filteredValue = {
codigoMarca: values?.id,
descripcionMarca: values?.brandDescription,
estatus: values?.statusDescription ? 'A' : 'C',
descripcionCortaMarca: values?.brandShortDescription,
};
await request(filteredValue)
helpers.resetForm();
handleModal();
},
});
const setValues = (values: BrandsFront | undefined) => {
const newValue = {
id: values!.id,
brandDescription: values!.brandDescription,
brandShortDescription: values!.brandShortDescription,
imagePath: '',
statusDescription: values!.statusDescription === "Activo" ? true : false,
};
formik.setValues(newValue);
};
<Autocomplete
id="asynchronous-brands"
isOptionEqualToValue={(opt, value) => opt.id === value.id}
value={formik.values.brandDescription}
getOptionLabel={(option) => option.label}
options={brands}
onInputChange={formik.handleChange}
onChange={formik.handleChange}
inputValue={formik.values.brandDescription}
renderInput={(params) => (
<TextField
sx={{-- styles --}}
{...params}
placeholder="Descripción de Marca"
/>
)}
size="small"
/>
Facing issues with the Autocomplete component from material UI, made several attempts to adjust props but still receiving the same error message