zoukankan      html  css  js  c++  java
  • React成长路之踩坑路 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

      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()的操作,这种情况会出现在callback中,我们的异步请求返回数据之前,组件可能就已经被卸载了,等数据回来再使用setState就会报出上面的警告,所以我们应该手动在componentWillUnmount时设置组件已卸载的标志,在数据处理setState()时先判断组件是否仍被挂载,否则不再执行setState

      解决办法

      

    componentDidMount() {
        this._isMounted = true   //设置组件是否被装载标志位
        this.getList()
      }
    
    componentWillUnmount() {
        this._isMounted = false
      }
    
    getList() {
        const user = this.props.user
        const result = getOrderListData(user)
        result.then(res => {
          return res.json()
        }).then(json => {
          if(this._isMounted) {   //在setState()之前先判断组件是否被装载
            this.setState({
              lists: json
            })
          }
        }).catch(ex => {
          if(_DEV_) {
            console.log('请求订单列表时报错报错' + ex.message)
          }
        })
      }
    码农随笔防失忆,只为记录风雨路上的脚丫印印~
  • 相关阅读:
    进制转化
    递归小结
    Java异常处理面试题归纳
    字符串相加 内存分配
    递归与循环
    cookie
    会话管理
    在javaweb中通过servlet类和普通类读取资源文件
    JS中遍历EL表达式中后台传过来的Java集合
    Ztree加载完成后显示勾选节点
  • 原文地址:https://www.cnblogs.com/bella-lin/p/9646315.html
Copyright © 2011-2022 走看看