title: How to use setState after a css transition ends in React JS?
body: <pre><code>//sample piece of codes
  
  constructor() {
      super()
    this.state.opacity= '0'
    this.state.mover = 'translateY(-40%)'
   }
  
  
  this.setState({opacity:'1'})
  this.setState({mover: 'translateY(-900%)'}, () =&gt; {this.setState({opacity:'0'})})
  </code></pre>
  <p>when I click on a button, I want a div to appear (using opacity 1) and transition to top and fade out after reaching the top(using opacity 0).</p>
  <p>But it didn't work the way I expected. Currently, it fades out instantly. It doesn't wait for the transition to end. I want it to fade out <strong>after</strong> the transition ends.</p>
  <p>Is there a way in React to fix it ? I am very new in react. Help is much appreciated. Thanks.</p>