I have a Material UI(MUI) TextField component
<TextField
error={contents.desc.length > 50}
required
value={contents.desc}
name="desc"
sx={{ marginBottom: 3 }}
label="Describe Me"
fullWidth
onInput={handleChange}
/>
and a Material UI(MUI) Rating component
<Rating
name="rating"
defaultValue={contents.rating}
precision={0.5}
sx={{ scale: "1.2" }}
onChange={(_, value) => {
setContents({ rating: value });
}}
/>
Now, every time I change my rating, the error property in TextField throws an error like Cannot read properties of undefined (reading 'length'). But, that error property alone doesn't generate any error. It works perfectly once the condition is satisfied. I don't know how change in rating is affecting the length property of another component.
contents in contents.desc is an object with desc as one of its property.