Ics Ics - 3 years ago 168
React JSX Question

Pass data to Parent from Child-1.1 (Parent -> Child-1 -> Child-1.1)

If i have: Parent -> Child-1 -> Child-1.1 (Child-1 is parent of Child 1.1)

To send data from Child-1.1 to Parent component, i need a callback function to send data to Child-1 first and then to Parent or i can use a callback function to send directly from Child-1.1 to Parent component?

From Child-1.1 i sent data to Child-1, because i made a callback function, onClick in Child-1-1, but in Child-1 i don't have any button to make another callback function to send to Parent. How can i send data if i don't have any button to put onClick? I use onLoad? That's why i ask if i can send directly from Child-1.1 to Parent component, using the callback function tiggered by onClick from Child-1.1.

Thank you!

Answer Source

you will have to pass down the function from Parent component to Child1 and then Child1.1

class Parent extends React.Component {

  action = () => {

  }

  render() {
    return <Child action={this.action}/>;
  }
}

class Child extends React.Component {
  render() {
    return <Child1 action={this.props.action} />;
  }
}

class Child1 extends React.Component {
  render() {
    return <button onClick={this.props.action} />;
  }
}
Recommended from our users: Dynamic Network Monitoring from WhatsUp Gold from IPSwitch. Free Download