ReactJs erhalten den Status der untergeordneten Komponente

Question

Ich möchte den Status meiner untergeordneten Komponente in meiner übergeordneten Komponente in this example verwenden. was ich will genau der Lage sein, dies zu tun:

<Application onChange={(myVar)=>{console.log(myVar)}}/> 

Answer 1

Sie sind onChange nur eine normale Stütze ist, die Sie in Ihre Anwendungskomponente übergeben. Wenn es eine Funktion ist, können Sie sie jederzeit aufrufen. In diesem Fall ist es sinnvoller, sie aufzurufen, wenn die Anwendung state aktualisiert wird. Sie können den zweiten Parameter der Funktion setState verwenden, der dafür eine optionale Callback-Funktion ist. Aber stellen Sie sicher, dass Sie onChange Prop ist definiert, und es ist eine Funktion, bevor Sie es mit einem Parameter aufrufen, die Sie übergeben möchten.

class Application extends React.Component { 
    constructor(props){ 
    super(props); 
    this.state = {myVar:0}; 
    setInterval(()=>{ 
     this.setState({ myVar:this.state.myVar + 1 },() => { 
     if(this.props.onChange && typeof this.props.onChange === "function") 
      this.props.onChange(this.state.myVar) 
     }); 
     }, 3000); 
    } 

    //..... 

} 

Aktualisiert Codepen: https://codepen.io/anon/pen/gWvKxa