1

componentDidUpdate lifecycle method is not called while navigating from portrait to landscape in iPhone 6 safari browser. Could anyone please let me know whether there any workaround for this?

Soroush Chehresa
  • 5,490
  • 1
  • 14
  • 29
Jagadish N
  • 29
  • 6
  • please provide some code so we can better understand – Joe C Oct 08 '18 at 10:30
  • You have to somehow detect the orientation with an event, then save it in your local state or redux store. componentDidUpdate will only be call if a prop or your state changes – Kevin Amiranoff Oct 08 '18 at 10:53
  • `componentDidUpdate` is called when component's state or props changes. Unless you do track orientation mode in your device and pass it to your component, there will be no lifecycle update. – blaz Oct 08 '18 at 10:57
  • But I see in chrome iphone simulator, the componentDidUpdate is called while navigating from portrait to landscape even though im not updating any of the props. – Jagadish N Oct 08 '18 at 11:01

1 Answers1

0

I haven't tried it but that should work

constructor() {

  window.addEventListener('orientationchange', this.onOrientationChange);

  this.state = {
    orientation: null
  }

}

onOrientationChange = () => {
    switch(window.orientation) {  
      case -90 || 90:
        this.setState({orientation: 'landscape'})
        break; 
      default:
      this.setState({orientation: 'portrait'})
        break; 
    }
}

componentDidUpdate() {
  console.log('componentDidUpdate called', this.state.orientation)
}

Take a look at that answer

Kevin Amiranoff
  • 13,440
  • 11
  • 59
  • 90