vue 监听当前页面

 methods: {
        // 业务操作
        handleVisibilityChange() {
            if (document.visibilityState === 'hidden') {
                console.info('ws  hidden>>>关闭定时器');
            }
            else if (document.visibilityState === 'visible') {
                console.info('ws  visible>>>启动定时器');
            }
        }
    },
    mounted() {
       // 监听当前页面 显示状态
       window.addEventListener('visibilitychange', this.handleVisibilityChange);

        // 当页面被销毁时 移除监听(这方法可以换成周期方法中的 beforeDestroy 或 destroyed)
        this.$on('hook:beforeDestroy', () => {
            console.info('ws 我被销毁了, 移除监听>>>');
            window.removeEventListener('visibilitychange', this.handleVisibilityChange)
        })
    },

参考地址:vue监控当前标签页是否显示状态 - (jianshu.com)

你可能感兴趣的:(vue 监听当前页面)