惯性聚合 高效追踪和阅读你感兴趣的博客、新闻、科技资讯
阅读原文 在惯性聚合中打开

推荐订阅源

V
Visual Studio Blog
爱范儿
爱范儿
GbyAI
GbyAI
博客园 - 叶小钗
Last Week in AI
Last Week in AI
Jina AI
Jina AI
Microsoft Security Blog
Microsoft Security Blog
云风的 BLOG
云风的 BLOG
C
Check Point Blog
H
Help Net Security
P
Proofpoint News Feed
酷 壳 – CoolShell
酷 壳 – CoolShell
让小产品的独立变现更简单 - ezindie.com
让小产品的独立变现更简单 - ezindie.com
大猫的无限游戏
大猫的无限游戏
H
Hackread – Cybersecurity News, Data Breaches, AI and More
B
Blog RSS Feed
Y
Y Combinator Blog
U
Unit 42
T
Tailwind CSS Blog
MyScale Blog
MyScale Blog
N
Netflix TechBlog - Medium
S
SegmentFault 最新的问题
J
Java Code Geeks
钛媒体:引领未来商业与生活新知
钛媒体:引领未来商业与生活新知

Hyde Blog

Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog Hyde Blog
Hyde Blog
Hyde · 2025-10-05 · via Hyde Blog

离开提醒与欢迎回归效果 ​

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

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

ts

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

titleChange();  //动态标题

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

sh

pnpm install --save-dev @types/node

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