ReactJS - Kontext des Elternstatus in seinem Kind verwenden

Question

Ich habe ein kleines Problem. Ich möchte den Status meines Elternteils mithilfe eines Requisiten-Rückrufs in meinem Kind festlegen. Situation sieht ähnlich wie:

ELTERN COMPONENT

(...) 
onOptionsChange(newState){ 
     this.setState(newState); 
    } 
render(){ 
    return (
     <Options onOptionsChange={(newState) => 
     this.onOptionsChange(newState)} /> 
     ) 
} 
} 
(...) 

KIND COMPONENT

(...) 
switch(option.target.id) { 
      case 'facebook': 
       this.props.onOptionsChange({...this.state, 
       options:{...this.state.options, 
       facebook: option.target.checked}}) 
(...) 

... aber der letzte Kontext ist immer mein Kind Kontext, so dass die App stürzt ab. Gibt es eine Möglichkeit, den Kontext von Kind zu Eltern zu verschieben? Prost

Answer 1

Im Idealfall haben Sie einen Zustand, in der übergeordneten Komponente, die Sie auf das Kind übertragen werden und dann von den Requisiten des Kind nutzt es, und wenn es irgendeine Änderung vornehmen will, wird es den übergeordneten Zustand

aktualisieren versuchen sie es wie

Parent

(...) 
constructor() { 
    super(); 
    this.state = { 
     data : {// some state, option : {//values here}, facebook: false} 
    } 
} 
... 
onOptionsChange(newState){ 
     this.setState({data: newState}); 
    } 
render(){ 
    return (
     <Options onOptionsChange={(newState) => 
     this.onOptionsChange(newState)} data = {this.state.data}/> 
     ) 
} 
} 
(...) 

ChildComponent

(...) 
switch(option.target.id) { 
      case 'facebook': 
       this.props.onOptionsChange({...this.props.data, 
       options:{...this.props.options, 
       facebook: option.target.checked}}) 
(...)