usePageTabSwitch

Introduction

当浏览器页面切换时执行的回调函数

Basic Usage

import { usePageTabSwitch } from '@flypeng/tool/browser';

const clear = usePageTabSwitch(() => {
  // todo things
});

// The callback needs to be canceled at some time
clear();

Type Declaration

/**
 * 当浏览器页面切换时执行的回调函数
 * @param callback
 */
declare function usePageTabSwitch(callback: () => void): () => void;

Online Demo

usePageTabSwitch

当浏览器页面切换时执行的回调函数

<script lang="ts" setup>
import { onUnmounted } from 'vue';
import { usePageTabSwitch } from '@flypeng/tool/browser';

const clear = usePageTabSwitch(() => {
  const isPageHidden = document.hidden;
  if (isPageHidden) {
    document.title = 'usePageTabSwitch | Hidden';
  } else {
    document.title = 'usePageTabSwitch | Show';
    setTimeout(() => (document.title = 'usePageTabSwitch | @flypeng/tool'), 1000);
  }
});

onUnmounted(() => {
  clear();
});
</script>

<template>
  <div>Notice current page title change</div>
</template>