如何解决Redux表单:更新syncErrors导致表单跳过修改
我的redux-form
中有一个复选框,当按下该复选框时,它会显示一毫秒,就好像它未选中一样,然后又返回到先前的选中状态,并且仅在第二次单击复选框时才真正取消选中它。我调查了redux-dev-tools
,它显示出CHANGE
表单事件之后,接着出现UPDATE_SYNC_ERRORS
。这是我的一些代码:
const ProjectFamiliesFilterInput = React.memo(({ familyOptions,analysisGroupOptions,projectAnalysisGroupsByGuid,value,onChange,...props }) => {
const [ allFamiliesSelected,updateallFamiliesSelected ] = useState(value.familyGuids.length === 0)
const firstUpdate = useRef(true)
useLayoutEffect(() => {
if (firstUpdate.current) {
firstUpdate.current = false;
return;
}
console.log(value)
updateallFamiliesSelected(!value.familyGuids || value.familyGuids.length === familyOptions.length)
})
const selectedFamilies = allFamiliesSelected ? [] : value.familyGuids
const onFamiliesChange = familyGuids => onChange({ ...value,familyGuids })
const selectedAnalysisGroups = allFamiliesSelected ? [] :
getSelectedAnalysisGroups(projectAnalysisGroupsByGuid,value.familyGuids).map(group => group.analysisGroupGuid)
const selectAnalysisGroup = (analysisGroups) => {
if (analysisGroups.length > selectedAnalysisGroups.length) {
const newGroupGuid = analysisGroups.find(analysisGroupGuid => !selectedAnalysisGroups.includes(analysisGroupGuid))
onFamiliesChange([...new Set([...value.familyGuids,...projectAnalysisGroupsByGuid[newGroupGuid].familyGuids])])
} else if (analysisGroups.length < selectedAnalysisGroups.length) {
const removedGroupGuid = selectedAnalysisGroups.find(analysisGroupGuid => !analysisGroups.includes(analysisGroupGuid))
onFamiliesChange(value.familyGuids.filter(familyGuid => !projectAnalysisGroupsByGuid[removedGroupGuid].familyGuids.includes(familyGuid)))
}
}
const selectAllFamilies = (checked) => {
if (checked) {
onFamiliesChange(familyOptions.map((opt => opt.value)))
} else {
onFamiliesChange([])
}
}
return (
<Form.Group inline widths="equal">
<BooleanCheckBox
{...props}
value={allFamiliesSelected}
onChange={selectAllFamilies}
width={5}
label="Include All Families"
/>
</Form.Group>
)
})
为什么会发生这种情况?我在哪里可以尝试进行调试?
版权声明:本文内容由互联网用户自发贡献,该文观点与技术仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容, 请发送邮件至 dio@foxmail.com 举报,一经查实,本站将立刻删除。