在App.vue文件中添加如下代码:
<template>
<!-- <div id="nav">
<router-link to="/">Home</router-link> |
<router-link to="/about">About</router-link>
</div> -->
<router-view />
</template>
<style lang="scss">
.el-pagination__total {
border: 1px solid #c0c4cc;
margin-left: 10px;
border-radius: 5px;
// padding: 5px;
padding: 0px 5px;
font-weight: 400;
color: var(--el-text-color-regular);
}
</style>
<script>
export default {
setup() {},
mounted() {
//用户无操作定时返回首页功能
document.addEventListener("scroll",this.recordLastTime);
document.addEventListener("click",this.recordLastTime);
document.addEventListener("input",this.recordLastTime);
beforeDestory()
{
//页面销毁时候清除定时器
clearInterval(this.timer);
//移除事件监听器
document.addEventListener("scroll",this.recordLastTime);
document.addEventListener("click",this.recordLastTime);
document.addEventListener("input",this.recordLastTime);
}
},
data() {
return {
lastTime:null,
timeOut:2*60*1000,
timer:null,
};
},
watch:{
"$route.path"(val){
if(val !=="/"&& this.timer == null){
this.lastTime =new Data().getTime();
this.timer =setInterval(()=>{
if(new Date().getTime - this,this.lastTime > this.timeOut){
//只有在当前页面不为首页才跳转到首页
if(this.$route.path !== "/Login"){
this.lastTime=new Data().getTime();
this.$route.replace("/Login")
}
}
},1000);
}
//回到首页清除定时器
if(val ==='Login' && this.timer){
clearInterval(this.timer);
this.timer =null;
}
}
},
methods: {
recordLastTime(){
this.lastTime =new Date().getTime();
},
}
};
</script>