Fire event on reload/close of window

Question

So, I need to fire a rest api call whenever a reload of the page, change the page, closing the window or tab event happens

For this, I have followed this post

reactjs event listener beforeunload added but not removed

It works with page reload and changing the page, but not on tab or window close.

I don't want to show a confirm message, just make the api call

class comp extends Component {
  constructor(props) {
    super(props);
    this.handleWindowClose = this.handleWindowClose.bind(this);
  }

  componentDidMount() {
    window.addEventListener('beforeunload', this.handleWindowClose);
  }

  componentWillUnmount() {
    window.removeEventListener('beforeunload', this.handleWindowClose);
  }

  handleWindowClose(event) {
    event.preventDefault();
    if (!this.props.locked)
      unlockItem(this.props.id, this.props.version);
  }

  render() {
  }
}

Any suggestion?

Could it be that componentWillUnmount runs before beforeunload event when closing? What happens if you comment out componentWillUnmount? — Moti Korets, Mar 21 '18 at 22:26
*THWOMP*... that's the sound the desk makes when meeting my face. I didn't tried it!!!! Will do ASAP — CJLopez, Mar 21 '18 at 23:35
Well, no, I commented the `componentWillUnmount` line and it's still not being triggered on tab/window close — CJLopez, Mar 21 '18 at 23:43
well does the event fire at all? if you remove the if statement does it work? — Moti Korets, Mar 22 '18 at 01:46
It does fire on page reload and page change, but not when closing the window/tab — CJLopez, Mar 22 '18 at 15:15

Fire event on reload/close of window

0 Answers0