reactjs使用useState和useEffect避免无限循环

Question

如何避免无限循环？我的意思是，第一次点击StudentSubject必须是未定义的，第二次点击它将获得数据，在我当前的代码中，结果是无限循环，它不断循环console.log(getStudentId, getRelevance)如何避免这种情况？

const [getStudentId, setStudentId]= useState();
const [getRelevance, setRelevance]= useState();
useEffect(() => {
student();
}, []);

const onClickGrade = (studentId, relevance) => {
.....
console.log(getStudentId, getRelevance) //undefined
if(StudentSubject === undefined){
onClickGrade(studentId, relevance) //infinite loop
}
....
}
const student = () => {
.....
view.on('click', onClickMap);
.....
}
const onClickStudent = (event)=>{
const studentId = student.getAttribute('id');
const relevance = student.getAttribute('relevance');
setStudentId(studentId)
setRelevance(relevance)
onClickGrade(studentId, relevance)
}

Answer 1

您正在递归调用onClickGrade

const onClickGrade = (studentId, relevance) => {
.....
onClickGrade(studentId, relevance) ## Infinite loop in a recursive call
....
}

这取决于你想要实现什么，但你肯定需要改变你的逻辑，或者至少添加一个条件来防止递归中的无限循环！你的学生主题听起来总是不明确。您可能需要保存以前的StudentSubject并将其与当前主题进行比较。

if (studnetSubject === prevStendentSubject) return