控制台报错Warning: Can only update a mounted or mounting component. This usually means you called setState, replaceState, or forceUpdate on an unmounted component. This is a no-op.
一般这种情况会出现在一个没有卸载的组件中执行了setState()操作。
比如我们加载了一个页面,页面正在执行一些异步请求操作,在数据还没有回来之前,我们就切换了页面,导致这个组件被卸载了,但是等数据返回以后调用setState的时候控制台就会输出上边的警告。
对此,官网给出了我们一个解决方案:isMounted
简化示例:
componentWillMount() {
this._isMounted = true
fetch(url).then (response)=>{
if (this._isMounted) {
this.setState({ ...response })
}
});
}
componentWillUnmount() {
this._isMounted = false
}
以上是参考官方的解决方案,然而当我们修改别人的代码时,可能不太想改动太大,那么可以尝试下面的解决方案:
componentWillUnmount(){
// 重写组件的setState方法,直接返回空
this.setState = ()=>{
return ;
}
}
这个方法可以比较快速的解决现有报错问题,但是要慎重使用,请注意不要修改了父组件的setState方法。
网友评论