Alter Zustand der Eltern von einem Kind Komponente Reagieren js

Question

class Parent extends React.Component{ 
    constructor(props){ 
    super(props); 
    this.state={ 
     data : props.data 
    }; 
    } 

    render(){ 
    for(let i=0;i<this.state.data.length;i++){ 
     let row = this.state.data[i]; 
     //row.value = 0 here 
     outs.push(<Children row={row}/>); 
    }  
    } 
} 

class Children extends React.Component{ 
    constructor(props){ 
    super(props); 
    } 

    render(){ 
    let row = this.props.row; 
     this.changeRowValue(row); 
     if(row.value == 1){ 
      //do something 
     } 
     .... 
    } 

    changeRowValue(row){ 
     row.value = 1; 
     //how do i set the state of data object here ? 
    } 
} 

Beispiel des Datenobjekts

data =

[0] => {value : 0,someother : somevalue}, 

[1] => {value : 0,someother : somevalue}, 

[2] => {value : 0,someother : somevalue} 

wenn ich den Wert von data[1].value = 1 in Children Klasse ändern, wie kann ich einstellen Zustand des Ganzen data Objekt?

Answer 1

Sie müssen die Daten im übergeordneten Objekt aktualisieren und React die untergeordneten Aktualisierungen selbst behandeln lassen. Ein Beispiel dafür, wie das aussehen würde, ist:

class ParentComponent extends React.Component { 
    onChangeValue = (index, newData) => { 
     let data = this.state.data; 
     data[index] = newData; 

     this.setState({ data }); 
    } 

    render() { 
     let outs = []; 

     for (let i = 0; i < 10; i++) { 
      let row = this.state.data[i]; 

      outs.push(
       <ChildComponent index={ i } row={ row } onChangeValue={ this.onChangeValue }/> 
      ); 
     } 

     return <div>{ outs }</div>; 
    } 
} 

class ChildComponent extends React.Component { 
    ... 

    onChangeValue() { 
     const { index, onChangeValue } = this.props; 
     this.props.onChangeValue(index, { someNewValue }); 
    } 
} 

, wenn man etwas in das Kind aktualisieren möchten, dann würden Sie seine onChangeValue Methode aufrufen, die wiederum onChangeValue die Eltern nennt.