React异步请求数据出现setState(...): Can only update a mounted or mounting component...

本文介绍了在React中遇到的错误警告:setState(...): Can only update a mounted or mounting component...。该警告通常发生在异步请求数据时,组件已被卸载。解决方法是在componentDidMount设置标志位_isMounted为true,在componentWillUnmount设为false,确保只有在组件挂载状态下才执行setState(),避免无用操作。
摘要由CSDN通过智能技术生成

Warning: setState(…): Can only update a mounted or mounting component. This usually means you called setState() on an unmounted component. This is a no-op. Please check the code for the XXX component.

错误警告是我们可能对一个没有装载的组件执行了setState()操作,在React的官网里有一个解决办法,isMounted

出现的原因:
这种情况通常出现在callback中,我们的异步请求返回数据之前,组件可能就已经被卸载了,等数据回来再使用setState()j就会报出上面的警告,所以我们应该手动在componentWillUnmount里去取消callback在它被unmounting之前。

解决办法:
我们可以使用一个标志位_isMounted,在componentDidMount里设置为true,在componentWillUnmount里设置为false,仅当_isMounted为true即还未被卸载,才执行setState()

我的代码:

componentDidMount () {
    this._isMounted = true
    
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值