Javascript setstate未使用动态键名更新

我不知道为什么我的状态不会用errorOption=key+'Error'更新，然后用[errorOption]：true设置状态。因为我的formErrors状态使用了与formDetails相同的初始键，但是在末尾有'Error'，所以我只是将它连接起来。我也尝试过使用模板文本，但这里的连接看起来更容易阅读

我希望它验证表单，检查是否为空，并将错误状态更改为true

const defaultData = {
    username: '',
    password: '',
}
const defaultErrorState = {
    usernameError: false,
    passwordError: false,
}

const [formDetails, setFormDetails] = useState(defaultData);
const [formErrors, setFormError] = useState(defaultErrorState);

const {
    username,
    password
} = formDetails

const {
    usernameError,
    passwordError
} = formErrors


const validateForm = (inputs) => {
    const checkThreshold = (currentValue) => currentValue.length > 0;
    let errorOption
    Object.entries(inputs).forEach(([key, value]) => {
        if (!checkThreshold(value)) {
            errorOption = key + 'Error'
            setFormError({
                ...formErrors,
                [errorOption]: true
            })
        }
    })
    Object.entries(inputs).every(checkThreshold)
}

const handleSubmit = (event) => {

    const basicInfoValues = {
        username: username,
        password: password,
    }
    if (validateForm(basicInfoValues)){
        // login stuff
    } else {alert("Fill in all fields")}

}

---

不要根据键名动态计算键，只需组合状态，使每个属性都是一个包含字符串

值
属性和布尔
错误
属性的对象。您能告诉我们
输入是什么吗？也许它正在按照您的期望设置它，但是在将来的迭代中会覆盖它吗？