0

Before the browser is closed, I want to send data to the server that the user switches to the offline status.

After several days of studying the question, I have not found an answer.

How to track this event in vuejs/quasar framework?

technobot
  • 49
  • 1
  • 8
  • You can use `beforeunload` event, which will trigger before the browser is closed. – Mina Jun 30 '22 at 18:15
  • Does this answer your question? [Trying to detect browser close event](https://stackoverflow.com/questions/20853142/trying-to-detect-browser-close-event) – Gabe Jun 30 '22 at 18:21
  • Better if you provide some lines of code, and you can check this thread as well: https://forum.vuejs.org/t/how-detect-browser-tab-closing/114735 – O.Badr Jun 30 '22 at 20:56
  • It's more about the `visibilityChange`. hence, you can achieve this by check for `visibilityState`. Here is the documentation link : https://developer.mozilla.org/en-US/docs/Web/API/Document/visibilitychange_event – Debug Diva Jul 01 '22 at 06:25

1 Answers1

2

Getting idea from the same question in Vue.js forum, here is a possible solution:

import { createApp } from "vue";
import App from "./App.vue";

const app = createApp({
  extends: App,  
  created() {
    window.addEventListener("beforeunload", this.leaving);
  },  
  methods: {
    leaving() {
      // Your code here
    },
  },
});

app.mount("#app");

You can play with the complete example on CodeSandbox.

Note:

O.Badr
  • 2,853
  • 2
  • 27
  • 36