Reactjs Geschwisterkomponente erhält den aktualisierten Statuswert nicht

Question

1) Wie übermittele ich diesen Wert als Prop zu Child1 Komponente 2) Wenn ich den Statuswert nur an Child1-Komponente übergeben, erhalte ich nicht den aktualisierten Wert in Child1 -

Gefolgt verschiedene Artikel - über Requisiten zwischen Geschwistern aber nichts funktioniert .. Eltern vorbei:

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, 
}; 

Child2:

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

Sie waren nicht an Ihren Rückruf gebunden this. Sie sind this.setState wird nicht für Ihre Eltern aufgerufen, es heißt innerhalb Child2. Der Kontext von this in handleToggle stammt von Child2, nicht von Parent, wenn Sie ihn nicht binden.

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