这个问题可能是因为使用了与useContext相关的hook,例如useEffect等,导致了代码的循环。可以查看代码中是否有类似如下的结构:
useEffect(() => {
// some side effect
}, [someContextValue])
这里的代码会在someContextValue变更时执行,但是someContextValue可能会在这个useEffect里的某些操作中被修改,导致useEffect又被执行,从而出现了循环。一种解决方式是将此时需要监听的变量放到useReducer中,再获取其值,从而避免这种循环。
const [state, dispatch] = useReducer(reducer, {
someContextValue: useContext(SomeContext)
})
useEffect(() => {
// some side effect
}, [state.someContextValue])
这里,我们从useReducer中获取该值,而不是从useContext的返回值获取。这样,当这个值发生改变时,只会标记useEffect重新执行,从而避免了循环。