Reactjs 형제 구성 요소가 업데이트 된 상태 값을 가져 오지 않습니다.

Question

1)이 값을 Child1 구성 요소에 대한 보조 값으로 전달하는 방법 2) Child1 구성 요소에 상태 값을 전달하면 Child1 내에서 업데이트 된 값을 가져 오지 못합니다.

이어 다른 기사 - 형제 자매 아무것도 작동하지 사이에 소품을 전달하는 방법에 대한 .. 부모 :

export default class Parent extends Component { 

    constructor(props) { 
    super(props); 
    this.state = { 
     toggledata: '', 
    }; 
    } 

    handleToggle(value) { //getting the updated value to 'value' 
    this.setState({ toggledata: value }); 
    } 

    render() { 
    return (
     <div> 
     <Child1 ToggleStatus={this.state.toggledata} /> 
     <Child2 callbackFromParent={this.handleToggle.bind(this)} /> 
     </div> 
    ); 
    } 
} 
Parent.propTypes = { 
    params: PropTypes.object, 
}; 

자식 2 :

class Child1 extends Component { 
constructor(props) { 
    super(props); 
    this.state = { 
     text: '', 
    }; 
    } 

    handleClick(event) { 
    this.setState({ text: 'green' },() => { 
     this.props.callbackFromParent(this.state.text); 
    }); 
    } 

render(){ 
return (
      <a onClick={() => { this.handleClick(event) }} href=""> 
      Click me 
      </a> 

    ); 
    } 
} 
export default Child1; 

Answer 1

콜백에 this을 바인딩하지 않았습니다. 부모님을 위해 this.setState을 부르지 않았 으면 Child2라고합니다. 컨텍스트가 this 인 경우 handleToggle은 Child2에서 가져온 것이고 바인딩하지 않으면 부모가 아닙니다.

<Child2 callbackFromParent={this.handleToggle.bind(this)} />