dleitee / dleitee/react-fetches

Usage of setState with unmounted component

Open
#5 1 comment 0 reactions 0 assignees View on GitHub
Dominant language
JavaScript
Stars
251
Forks
11
PR merge metrics
No merged PRs in 30d

Description

**view.js**
```es6
class View extends Component {

//...

addGroup() {
this.props.addGroup({ name: 'Name of Group' }).then(({data}) => {
this.setState((prevState) => ({
addedGroups: [...prevState.addedGroupd, data]
}))
})
}

//...
```

If the component unmounts before the request finish, you will get the
`Warning: Can't call setState (or forceUpdate) 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.` warning. Do you have a solution for this?

Contributor guide

No contributing guide indexed for this repository

Research direction

Start with view.js and the addGroup method shown in the issue, then inspect how the request promise and component lifecycle are handled. Reproduce the unmount-before-completion case and confirm that the completed request no longer attempts state updates after unmounting.

Written by the indexing model from the issue text.

Assessment

Tech stack
javascript, react
Domain
frontend
Issue type
Bug
Difficulty
4/5
Estimated time
3-5 days
Activity status
Stale
Clarity
Needs clarification
Newbie friendliness
25/100

Get new issues in your inbox

A short digest of beginner-friendly GitHub issues.