Vue3监听页面刷新和关闭功能

在 Vue3 中，可以通过在 `setup` 函数中使用 `onMounted` 和 `onUnmounted` 钩子函数来监听页面的刷新和关闭事件。

监听页面刷新：

import { onMounted } from 'vue';

export default {
  setup() {
    onMounted(() => {
      window.addEventListener('beforeunload', function (event) {
        // 在此处添加你的逻辑代码
      });
    });
  },
};

监听页面关闭：

import { onMounted, onUnmounted } from 'vue';

export default {
  setup() {
    const handler = () => {
      // 在此处添加你的逻辑代码
    };

    onMounted(() => {
      window.addEventListener('beforeunload', handler);
    });

    onUnmounted(() => {
      window.removeEventListener('beforeunload', handler);
    });
  },
};

在 `onMounted` 钩子函数中添加监听事件，当页面刷新时，会触发 `beforeunload` 事件，然后执行相应的逻辑代码。在 `onUnmounted` 钩子函数中移除监听事件，避免内存泄漏。