mount-aware-component
v1.0.1
Published
Add mount awareness to class-based React components
Downloads
1
Readme
mount-aware-component
Add mount awareness to class-based React components.
When using ES6 classes, Component.isMounted()
is not available and it is recommended to instead clean up all
pending timeout and requests in componentWillUnmount()
. However, there are at least two cases where this is not easily
possible:
- when using
fetch()
since it cannot be canceled like AJAX requests can (see here) - when using promises that can not be canceled synchronously (or at all)
As a workaround, this component keeps track of its mounted state manually (see here) and provides helper functions to allow its subclasses to perform actions only if it is still mounted.
Usage
import MountAwareComponent from 'mount-aware-component';
class MyComponent extends MountAwareComponent {
foo() {
doSomethingAsync().then(function (result) {
this.setStateIfMounted({ bar: result.bar });
}.bind(this));
}
baz() {
doSomethingAsync().then(function () {
this.forceUpdateIfMounted();
}.bind(this));
}
}