在输入表单的onChange功能上使用setState更新状态,导致页面崩溃.setState未更新状态


const RoomAttendanceComponent = () => {
const [formData, setFormData] = useState({});
const [optionalIds, setOptionalIds] = useState([]);
let ids = []
const fetchAttendanceCriteria = (updatedFormData) =>
updatedFormData.classRoomNo && updatedFormData.selectedDay &&
(formData.classRoomNo !== updatedFormData.classRoomNo ||
formData.selectedDay !== updatedFormData.selectedDay);
const fetchAttendance = async (updatedFormData) => {
const response = await fetchAttendanceData(updatedFormData);
getAttendanceResults(response);
setFormData(updatedFormData);
};
const onChange = async ({ formData: updatedFormData, errors }) => {
if (fetchAttendanceCriteria(updatedFormData)) {
await fetchAttendance(updatedFormData);
}
if(updatedFormData.membersId){
ids = formatMembersId(formData.membersId);
setOptionalIds(parseInt(ids))
}
};
const updatedPresentIds = (presentIds) => {
if (presentIds) {
ids = [...optionalIds, ...presentIds];
}
return ids;
};

return (
<RoomAttendaceGridComponent />
<RoomAttendanceFormCompoenent />
)
}

updatedFormData.membersId为我提供了id,例如{'67'、'6'、'5'},这是用户在输入字段中键入的id。但由于某种原因,更新onChange功能上的setOptionalids状态会破坏页面。

由于ids是一个数组,因此您应该通过像ids = ids.map(x => parseInt(x));这样的映射来解析ID的元素然后将其添加到setOptionalIds。我想你在parseInt中得到了一个错误。如果你能多解释一下,那么就很清楚了

最新更新