Ad

React Notify All Children That Parent Scrolled

- 1 answer

I have a React component called Conversation which renders potentially many Parts. I need each Part to know if the Conversation is scrolled. Is this possible, if so how?

class Conversation extends Component {
  handleScroll() {
      console.log('Each Part should be told that I just fired');
  }
  render() {
    <div className="conversation" onScroll={this.handleScroll.bind(this)}>
       <Part />
       <Part />
       <Part />
    </div>
  }
}
Ad

Answer

Parent components should always pass information to sub-components through props e.g.,:

<Part someProp={this.getPartProps()} />

So figure out what information each Part component needs and just provide it.

EDIT:

To propagate that information from your event handler you will need to use component local state:

handleScroll: function() {
    this.setState({scrollFired: true});
}

Then you can set the props on Part:

<Part scrollFired={this.state.scrollFired} />
Ad
source: stackoverflow.com
Ad