TypeError：无法读取 ReactJS 中未定义的属性“修剪”

Question

代码返回错误 TypeError: Cannot read property 'trim' of undefined,

const [category, setCategory] = useState();

const classes = useStyles();
const [fields, setFields] = useState([''
]);


const onChangeHandler = (e, i) => {                            
    const { name , value } = e.target
    const currentFields = [...fields];
    currentFields[i] = value;
    setFields(currentFields)
}

//Validators

const [errors, setErrors] = useState ('');

const onSubmit = (e) => {
    e.preventDefault()
    let errors = {};
    if (!category.trim()){
        errors.category="Select Type of Category is Required"
    }
    if (!fields.trim()){
        errors.fields="Field is Required/Remove empty Fields"
    }
    setErrors(errors)
    if (Object.keys(errors).length === 0){
        formSubmit()
    }
}

Answer 1

据我所知，您的category 状态初始值未定义。

const [category, setCategory] = useState();

您应该为其提供一个有效的字符串值。

const [category, setCategory] = useState("");

替代方法是使用空检查

if (category && !category.trim()){
  errors.category="Select Type of Category is Required"
}

或可选链接

if (!category?.trim()){
  errors.category="Select Type of Category is Required"
}

注意： 任何其他时候更新category 状态时，您还应该确保保持状态不变量，即它应该总是一个字符串，或者在访问时应用相同的替代检查那个状态。