最近碰到一个教育项目，要用到全局计时器，并且失焦停止，聚焦开始

下面直接上代码，全局变量存在seesion storage中，纯原生js，可在任意场景/框架中使用

setTime() {
			//初始化计时器
           sessionStorage.setItem("seconds", "00");
           sessionStorage.setItem("minutes", "00");
           sessionStorage.setItem("seconds2", "00");
           sessionStorage.setItem("minutes2", "00");
               
			//计时器模板
			window.setTime = (str, str2) => {
					//取值
                    let seconds = sessionStorage.getItem(str);
                    let minutes = sessionStorage.getItem(str2);
                    //转换成数字再换成字符串
                    let s = (parseInt(seconds) + 1).toString();
                    let m = (parseInt(minutes) + 1).toString();
                    //秒钟补0
                    s.length === 1 ? sessionStorage.setItem(str, `0${s}`) : sessionStorage.setItem(str, `${s}`);
                    //秒钟进位
                    if (seconds > 58) {
                    	//进位清零
                        sessionStorage.setItem(str, "00");
                        //分钟补0
                        m.length === 1 ? sessionStorage.setItem(str2, `0${m}`) : sessionStorage.setItem(str2, `${m}`);
                    }
                };
                //全局计时器，持续记时
                window.time = setInterval(() => {
                    window.setTime("seconds", "minutes");
                }, 1000);
				
				//全局计时器，失焦关闭，聚焦开启
                window.xxx = true;
                window.time2 = () => {
                    setTimeout(() => {
                        window.setTime("seconds2", "minutes2");
                        (window.isFocus === true) && (window.time2) ? window.time2() : "";
                    }, 1000);
                };
                window.time2();
                //窗口聚焦
                window.onfocus = () => {
                    window.isFocus = true;
                    window.time2();
                };
                //窗口失焦
                window.onblur = () => {
                    clearTimeout(window.time2);
                    window.isFocus = false;
                };
}

如何使用数据

因为是存在sessionStorage中的，所以直接用sessionStorage.getItem(str)就能拿到对应数据，且数据刷新后不清除，注意拿到的是字符串，且方法已经补0

一些问题

如果要刷新后计时器方法还能用，在app.vue(全局)中写一个window.onload，把以上方法写里面就行了,其他框架没用过，但是原理也差不多