//vuejs中使用vue-visibility-change全局(局部)监听浏览器页面之间的切换
1、下载vue-visibility-change
npm i vue-visibility-change -S
2、在main.js导入:
import visibility from 'vue-visibility-change';
Vue.use(visibility);
//全局使用
visibility.change((evt, hidden) => {
console.log('global callback: ' + hidden);
});
//如果是局部直接写道页面里(index.vue)
<template>
<div v-visibility-change="change">
...
</div>
</template>
methods:{
change(evt, hidden) {
//hidden为false的时候,表示从别的页面切换回当前页面
//hidden为true的时候,表示从当前页面切换到别的页面
if(hidden === false){
console.log('回到当前页了!')
}
},
}
以上是编程学习网小编为您介绍的“vuejs中使用vue-visibility-change全局(局部)监听浏览器”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vuejs中使用vue-visibility-change全局(局部)监听浏览器
基础教程推荐
猜你喜欢
- js屏蔽退格键(backspace或者叫后退键与F5) 2024-04-16
- CSS 实现 图片鼠标悬停折叠效果 2024-01-23
- 关于html选择框创建占位符的问题 2022-09-20
- Vue Router 的路由配置 动态路由和懒加载 2023-10-08
- 01Vue3-认识Vue 2023-10-08
- 微信小程序 自己制作小组件实例详解 2024-01-04
- js关闭浏览器窗口及检查浏览器关闭事件 2024-01-08
- html学习笔记 2023-10-28
- 前端打包到后台Vue elementui字体图标显示问题解决方案 2023-10-08
- JavaScript实现双向链表过程解析 2023-08-08