React 关于迅速关闭组件致使异步事件没有关闭导致提示内存泄漏
只说一种方法的两个形式:
- 通过在单个组件内的生命周期 componentWillUnmount 中关闭 异步操作,大多是指 setState操作
this.mounted = true if(this.mounted){ // 执行异步操作 this.setState(....) } componentWillUnmounted =() => { this.mounted = false }
- 封装高阶组件hoc,来处理问题组件比较多的情况
const WithUnmounted = wrappedComponent => { let _componentWillUnmount = wrappedComponent.prototype.componentWillUnmount; wrappedComponent.prototype.componentWillUnmount = function() { _componentWillUnmount && _componentWillUnmount.call(this, ...arguments); this.mounted = true; }; let _setState = wrappedComponent.prototype.setState; wrappedComponent.prototype.setState = function() { if (this.mounted) { return; } _setState.call(this, ...arguments); } return wrappedComponent }