ErrorNote) Warning: Can't perform a React state update on an unmounted component. [useEffect cleanup function]
Warning: Can't perform a React state update on an unmounted component.
This is a no-op, but it indicates a memory leak in your application.
To fix, cancel all subscriptions and asynchronous tasks in a useEffect
cleanup function.
경고 : 마운트 해제 된 구성 요소에서 반응 상태 업데이트를 수행 할 수 없습니다.
이것은 작동하지 않지만 응용 프로그램의 메모리 누수를 나타냅니다. 수정하려면 useEffect
정리 기능에서 모든 구독 및 비동기 작업을 취소하십시오.
useEffect(() => {
axios.post("/api/like/get-like-state", variable).then((res) => {
if (res.data.success && res.data.liked) {
setLiked(res.data.liked);
}
});
}, [variable]);
useEffect가 실행되는 최적의 장수에 따라 마운트된 값이 true로 설정되면 정리 기능이 false로 변경됩니다. 낱개 구성품이 ummounted와 마운트된 값이 false일 내역이 삭제되었습니다.mounted가 탑재된 값이 true(비동기) 날짜 업데이트가 진행됩니다.
useEffect(() => {
let mounted = true;
// 좋아요 상태 가져오기
axios.post("/api/like/get-like-state", variable).then((res) => {
if (res.data.success && res.data.liked && mounted) {
setLiked(res.data.liked);
}
});
// clean-up
return () => (mounted = false);
}, [variable]);
const Example = (props) => {
const unmounted = useRef(false);
useEffect(() => {
return () => { unmounted.current = true }
}, []);
const setFilter = () => {
// ...
props.dispatch(fetchCourses()).then(() => {
if (!unmounted.current) {
setLoading(false);
}
})
}
// ...
return (
<ReactTable onFetchData={setFilter} /* other props omitted */ />
);
}
Author And Source
이 문제에 관하여(ErrorNote) Warning: Can't perform a React state update on an unmounted component. [useEffect cleanup function]), 우리는 이곳에서 더 많은 자료를 발견하고 링크를 클릭하여 보았다 https://velog.io/@findmytrueself/ErrorNote-Warning-Cant-perform-a-React-state-update-on-an-unmounted-component.-This-is-a-no-op-but-it-indicates-a-memory-leak-in-your-application.-To-fix-cancel-all-subscriptions-and-asynchronous-tasks-in-a-useEffect-cleanup-function저자 귀속: 원작자 정보가 원작자 URL에 포함되어 있으며 저작권은 원작자 소유입니다.
우수한 개발자 콘텐츠 발견에 전념 (Collection and Share based on the CC Protocol.)