Warning in Unmounted Component
See original GitHub issueHi there,
after i update reactn
from version 1.0.0
to 2.0.1
i get on every page change this warning:
index.js:xxx 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 the componentWillUnmount method.
This didn’t happen before.
Here is an example of my implementation:
package.json:
"react": "^16.8.6",
"react-router": "^5.0.0",
"react-router-dom": "^5.0.0",
"redux": "^4.0.1",
"reactn": "^2.0.1",
"typescript": "3.4.5",
// also the types for each package
// index.tsx
import React from 'reactn';
import ReactDOM from 'react-dom';
import {BrowserRouter} from 'react-router-dom';
// typings made before
setGlobal({payments: [], invoices: []})
addReducer('getPayments', (global: State, dispatch: Dispatch) =>
axios.get('url/payments'...).then((data) => ({payments: data})
);
addReducer('getInvoices', (global: State, dispatch: Dispatch) =>
axios.get('url/invoices'...).then((data) => ({invoices: data})
);
ReactDOM.render(
<BrowserRouter>
<App />
</BrowserRouter>,
document.getElementById('root')
);
// App.tsx
import React from 'reactn';
const Payments = props => {
const [payments] = useGlobal('payments');
return <div>....</div>;
}
const Invoices = props => {
const [invoices] = useGlobal('invoices');
return <div>....</div>;
}
class App extends React.Component {
render() {
return (
<div>
<Payments />
<InvoiceList />
</div>
);
}
}
Not sure if this is related to https://github.com/CharlesStover/reactn/issues/28
Thanks for your help
Issue Analytics
- State:
- Created 4 years ago
- Reactions:1
- Comments:17 (15 by maintainers)
Top Results From Across the Web
Can't perform a React state update on an unmounted ...
Warning : Can't perform a React state update on an unmounted component. Solution. You can declare let isMounted = true inside useEffect ,...
Read more >React: Prevent state updates on unmounted components
Warning : Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in...
Read more >React: Stop checking if your component is mounted - Medium
Warning : Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in...
Read more >React prevent state updates on unmounted components
Warning : Can't perform a React state update on an unmounted component. This is a no-op, but it indicates a memory leak in...
Read more >React state update on an unmounted component - debuggr.io
If you are a react developer, there is a good chance that you faced this warning at least once: Warning: Can't perform a...
Read more >Top Related Medium Post
No results found
Top Related StackOverflow Question
No results found
Troubleshoot Live Code
Lightrun enables developers to add logs, metrics and snapshots to live code - no restarts or redeploys required.
Start FreeTop Related Reddit Thread
No results found
Top Related Hackernoon Post
No results found
Top Related Tweet
No results found
Top Related Dev.to Post
No results found
Top Related Hashnode Post
No results found
Top GitHub Comments
I tried to follow the problem in the debug, I hope it can help
I see this problem too when I change tabs, which unmounts some components. I will try to create a minimal reproduction.