onChange is not triggered when required component reaches viewport

[cullsin]

Hi,

I have a home page with few components. When I reach component 'x' , I need to trigger a state. It is not working. But onChange event triggered when initialize, but not on scroll. Please suggest what I am missing.

  <VizSensor
    scrollCheck
    key={index}
    onChange={(isVisible) => {
      this.setState({
        isButton: true
      });
    }}
  >
  <ComponentTest
    key={index}
    heading={item.heading}
    description={item.description}
    pros={homePageTranslations.subscriptionFeatures.pros}
    boxes={homePageTranslations.subscriptionFeatures.boxes}
    language={this.props.i18n.language}
    t={this.props.t}
  />
  </VizSensor>

`

[GaddMaster]

I would start with putting that function in a variable and pass the variable in!
For me, your function is just calling straight away

[joshwnj]

@cullsin I'm not sure I understand correctly... Could you please create an example like this, that shows the bug you're describing? https://codesandbox.io/s/p73kyx9zpm