无法摆脱:警告:无法对未安装的组件执行 React 状态更新
Can't get rid of: Warning: Can't perform a React state update on an unmounted component
完整警告消息:警告:无法对未安装的组件执行 React 状态更新。这是一个空操作,但它表明您的应用程序中存在内存泄漏。要修复,取消 useEffect 清理函数中的所有订阅和异步任务。
此警告不会持续显示,它会在需要时显示。大多数时间在应用程序刚刚启动时。
export default class something extends React.Component {
_isMounted = false;
state = {
};
componentDidMount() {
this._isMounted = true;
firebase = new Fire((error, user) => {
if (error) {
return alert('something something something something');
}
firebase.getLists((lists) => {
this.setState({ lists, user }, () => {
this.setState({ loading: false });
});
});
this.setState({ user });
});
}
componentWillUnmount() {
this._isMounted = true;
firebase.detach();
}
这是另一个包含所有 firebase 代码的文件
detach() {
this.unsubscribe();
}
我猜这与分离有关 firebase.detach
您的代码需要进行一些小的更新才能正常工作。
在更新任何状态变量之前,您需要检查 _isMounted
是否为 true
。
您还需要在 componentWillUnmount()
中设置 _isMounted=false
而不是 _isMounted=true
。
查看下面的更新代码:
export default class something extends React.Component {
_isMounted = false;
state = {
};
componentDidMount() {
this._isMounted = true;
firebase = new Fire((error, user) => {
if (error) {
return alert('something something something something');
}
firebase.getLists((lists) => {
if (this._isMounted){
this.setState({ lists, user }, () => {
this.setState({ loading: false });
});
}
});
if (this._isMounted){
this.setState({ user });
}
});
}
componentWillUnmount() {
this._isMounted = false;
firebase.detach();
}
完整警告消息:警告:无法对未安装的组件执行 React 状态更新。这是一个空操作,但它表明您的应用程序中存在内存泄漏。要修复,取消 useEffect 清理函数中的所有订阅和异步任务。
此警告不会持续显示,它会在需要时显示。大多数时间在应用程序刚刚启动时。
export default class something extends React.Component {
_isMounted = false;
state = {
};
componentDidMount() {
this._isMounted = true;
firebase = new Fire((error, user) => {
if (error) {
return alert('something something something something');
}
firebase.getLists((lists) => {
this.setState({ lists, user }, () => {
this.setState({ loading: false });
});
});
this.setState({ user });
});
}
componentWillUnmount() {
this._isMounted = true;
firebase.detach();
}
这是另一个包含所有 firebase 代码的文件
detach() {
this.unsubscribe();
}
我猜这与分离有关 firebase.detach
您的代码需要进行一些小的更新才能正常工作。
在更新任何状态变量之前,您需要检查 _isMounted
是否为 true
。
您还需要在 componentWillUnmount()
中设置 _isMounted=false
而不是 _isMounted=true
。
查看下面的更新代码:
export default class something extends React.Component {
_isMounted = false;
state = {
};
componentDidMount() {
this._isMounted = true;
firebase = new Fire((error, user) => {
if (error) {
return alert('something something something something');
}
firebase.getLists((lists) => {
if (this._isMounted){
this.setState({ lists, user }, () => {
this.setState({ loading: false });
});
}
});
if (this._isMounted){
this.setState({ user });
}
});
}
componentWillUnmount() {
this._isMounted = false;
firebase.detach();
}