跳到主要内容

离开提醒与欢迎回归效果

blog-frontend\kuailemao-blog\src\utils\title.ts

import { useEventListener } from "@vueuse/core";

export function titleChange() {
// 动态标题
let OriginTitile: string = document.title;
let titleTime: NodeJS.Timeout;
useEventListener(document, "visibilitychange", () => {
if (document.hidden) {
//离开当前页面时标签显示内容
document.title = "w(゚Д゚)w 不要走!再看看嘛!";
clearTimeout(titleTime);
} else {
//返回当前页面时标签显示内容
document.title = "♪(^∇^*)欢迎回来!";
//两秒后变回正常标题
titleTime = setTimeout(() => {
document.title = OriginTitile;
}, 2000);
}
});
}

blog-frontend\kuailemao-blog\src\main.ts

import { titleChange } from "./utils/title";

titleChange(); //动态标题

提示:找不到命名空间“NodeJS”。

pnpm install --save-dev @types/node

安装完成后重启开发服务端生效