子组件不断的向父组件传值，react如何实现

Question

问题描述

实现一个升级的游戏，第一局结束之后，自组件告诉父组件，升级＋1，第二局结束后，再通知父组件升级＋1

问题出现的环境背景及自己尝试过哪些方法

以下是我参考了阿里的实现方式，在componentdidmount中，子组件确实可以向父组件传值，但是第一局结束后，可以第二局，不能实现第三局.如果我把函数放在update中，那么组件会一只刷新。最后奔溃，求问如何解决
链接描述###
// 请把代码文本粘贴到下方（请勿用图片代替代码）

//父组件
 setLevel(level){
        console.log('setLvel',level)
        this.setState({
            level
        })
        console.log('new setLvel',level)
    }
    
  render(){
        console.log('level parent ',this.state.level)

        if(this.state.level===1){
          var  _urls = urls.slice(0,4);
            randomUrls =   this.spreadImg(_urls)
        }
        
        if(this.state.level===2){
              _urls = urls.slice(0,6);
              randomUrls =   this.spreadImg(_urls);
        }
        if(this.state.level===3){
            _urls = urls.slice(0,8);
            randomUrls =   this.spreadImg(_urls);
      }

        var bgStyle = {
            backgroundImage: `url(${bg})`,
            width:'100%',
            height:'100vh',
            backgroundSize:'contain'
        };
        return (
            <div style={bgStyle}>
                <section className="stage">
                    <section>
                        <ImgFigureSection 
                        setLevel = { level => this.setLevel(level) } 
                        level={this.state.level} 
                        randomUrls = {randomUrls} />
                    </section>
                </section>
            </div>
        )
    } 
    子组件
    componentDidMount(){
        console.log('didmount',this.state)
        if(this.state.level===1){
            setTimeout(()=>{
                this.props.setLevel(2)
            },10000)
        }else if(this.state===2){
            setTimeout(()=>{
                this.props.setLevel(3)
            },10000)
        }
    }    
    

你期待的结果是什么？实际看到的错误信息又是什么？

其中在子组件中，我并不希望用setTimeout，我想要level+1了，那么就通知父组件更新

Answer 1

你可以任何时候，在子组件里面 调用 this.props.setLevel()；

// 子组件
    endGane = () => {
        // 游戏结束
       this.props.setLevel()
    }
    componentDidMount(){
    }