vue3修改html中title标签 给 浏览器标签页 动态赋值 闪烁
需求：浏览器标签页 动态赋值 闪烁
彩色浏览器标签页标题：目前没有纯前端解决方案
- 方式1：用 Emoji 或特殊符号 增强视觉效果（如
🔴 重要通知） - 方式2：在页面内使用
<h1>+ CSS 替代标题显示 - 方式3：引导用户安装浏览器插件 自定义样式
示例：
使用方式1：做假动作 显示隐藏 替换 来实现闪烁效果
效果：
无标题有标题替换显示
无标题
有标题
主要代码
let isVisible = true //1秒闪烁使用let globalTitle: string = '排班管理系统';let webTitle = '首页';let title = `${webTitle} - ${globalTitle}` || globalTitle; //浏览器标签名 可动态设置let titleFlashTag = true //是否闪烁//在指定页面做效果 使用if 做判断if (router.currentRoute.value.path == '/shiftHandover/index' || router.currentRoute.value.path == '/jjb') {// storeViewDeta.$state.titleFlashTagTimes 存一个定时器字段到 vuex或者pinia 中 做切换页面时清空定时使用storeViewDeta.$state.titleFlashTagTimes = setInterval(() => {if (titleFlashTag) {isVisible = !isVisible//isVisible 为true显示 🔴 ${title} 图标加标题，为false 显示 自定义标题 //每秒切换显示 做闪烁效果document.title = isVisible ? ` 🔴 ${title}` : globalTitle}}, 1000)} else {//清空定时器 不做标题闪烁clearInterval(storeViewDeta.$state.titleFlashTagTimes)document.title = title}