Getting the following (common) message in my console:
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.
This is a common question, I know, I've been trying to figure out where my specific problem is. Below are the original code (with the error) as well as my attempted fix (did not work, but made es-lint happy).
setData is a state hook, if that wasn't clear.
Original code:
useEffect(() => {
if (!isExisting) {
const fetchData = async () => {
const response = await refreshData();
setData(response);
};
fetchData();
// eslint-disable-next-line react-hooks/exhaustive-deps
}
}, []);
Attempted Fix:
useEffect(() => {
if (!isExisting) {
const fetchData = async () => {
const response = await refreshData();
setData(response);
};
fetchData();
// eslint-disable-next-line react-hooks/exhaustive-deps
}
}, [isExisting, refreshData]);