reactjs -即使存在数据，输入也不附加。

Question

我是ReactJS的新手。

目前，我正在尝试将值名称设置为状态。即使通过检查元素进行调试，并且该值确实存在，但在提交时从console.log中查看时，该值仍然不会追加。当提交时的CategoryValueName状态显示值在那里，但仍然不会追加。知道我错过了什么吗？

感谢大家在这方面的帮助。

const FormPaymentInstruction = () = > {
    const[CategoryValue, setCategoryValue] = useState("");
    const[CategoryValueName, setCategoryValueName] = useState("");
    const selectCategory = (CategoryValue) = > {
        setCategoryValue(CategoryValue);
    }
    const getCategoryName = (CategoryValue) = > {
        setCategoryValueName(CategoryValue[CategoryValue.value].text);
    }
    const onSubmit = data = > {
        console.log(data);
        if (CategoryValue) {
            formData.append('CategoryValue', CategoryValue);
        } else {
            formData.append('CategoryValue', '');
        }
        if (CategoryValueName) {
            formData.append('CategoryValueName', CategoryValueName);
            console.log(CategoryValueName);
        } else {
            formData.append('CategoryValueName', '');
        }
    }

return (
    <div className="py-2">
        <input type="hidden" name="CategoryValueName" id="CategoryValueName" {...register('CategoryValueName')} value={CategoryValueName} />
        <label>Select Memo for Payment Instruction: <span style={{ color:'red' }}>*</span></label>
        <select 
            name="CategoryValue"
            id="CategoryValue"
            className="block w-full br-5 border-gray-300 rounded-md" 
            {...register('CategoryValue')}
            onChange={(e) => { selectCategory(e.target.value);getCategoryName(e.target) }}
            value={CategoryValue}
        >
            <option value="" disabled>-- Please select one --</option>
            <option value="1">Sponsorship</option>
            <option value="2">Donation</option>
        </select>
    </div>
)
}

Answer 1

挖出之后，我想我错过了一个步骤，那就是设置值，这就是为什么没有设置值。

const getCategoryName = (CategoryValueName) => {
        setCategoryValueName(CategoryValueName[CategoryValueName.value].text);
        setValue('CategoryValueName', CategoryValueName[CategoryValueName.value].text);
}