问题描述:在自助机上操作上会出现一个问题,就是用户操作到一半或者操作完成了就走了,没有返回到首页。
功能介绍:vue监听当前页面是否处于操作状态,如果超过指定的时间都处于待机无操作状态,直接返回到指定页面。
template代码如下:
<template>
<div id="app" @mousemove="moveEvent" @click="moveEvent">
<router-view v-if="isRefersh" />
</div>
</template>
script代码如下:
export default {
data() {
return {
countdown: 10
timmer: null
};
},
methods: {
/*监听鼠标滑动和点击事件*/
moveEvent() {
//在规定的状态下执行方法
if (this.$route.query.flag && localStorage.getItem('dType')) {
clearTimeout(this.timmer);
this.init();
}
},
init() {
this.timmer = setTimeout(() => {
window.location.href = '/index.html'
}, 1000 * this.countdown);
},
}
}
以上是编程学习网小编为您介绍的“vue监听当前页面是否处于操作状态,待机无操作状态返回指定页面”的全面内容,想了解更多关于 vuejs 内容,请继续关注编程基础学习网。
沃梦达教程
本文标题为:vue监听当前页面是否处于操作状态,待机无操作状态返回指定页面
基础教程推荐
猜你喜欢
- CSS 一行代码实现头像与国旗的融合 2024-04-09
- 用js+cookie记录滚动条位置 2024-04-15
- CSS多种方式实现底部对齐的示例代码 2023-12-23
- 从基础开始建立一个JS代码库第1/2页 2024-04-08
- 一篇文章看懂JavaScript中的回调 2024-02-06
- 解决移动端1px边框最好的方法(推荐) 2024-03-31
- jQuery实现根据滚动条位置加载相应内容功能 2024-04-02
- Layui数据表格模型 2022-12-14
- JavaScript 设计模式中的代理模式详解 2022-08-31
- 关于 javascript:Toggle v-navigation-drawer\\’s expa 2022-09-15