vue实现几秒后跳转新页面代码
更新时间：2020年09月09日 10:02:13 作者：☞小阿平☜
这篇文章主要介绍了vue实现几秒后跳转新页面代码，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧
我就废话不多说了，大家还是直接看代码吧~
<template>
<div @click="clickJump()">提交</div>
</template>
<script>
export default {
data(){
return {
count:"",//倒计时
}
}
},
mounted(){
},
methods: {
//几秒后进入跳转页面
clickJump(){
const timejump = 1;
if(!this.timer){
this.count = timejump ;
this.show = false;
this.timer = setInterval(()=>{
if(this.count > 0 && this.count <= timejump ){
this.count--;
}else{
this.show = true;
clearInterval(this.timer);
this.timer = null;
//跳转的页面写在此处
this.$router.push({path: '/address'});
}
},100)
}
},
}
</script>
补充知识：vue设置延时
一定要创建一个timer，然后调用延时之前先清除timer的延时
clearTimeout(this.timer); //清除延迟执行
this.timer = setTimeout(()=>{ //设置延迟执行
console.log('ok');
},1000);
以上这篇vue实现几秒后跳转新页面代码就是小编分享给大家的全部内容了，希望能给大家一个参考，也希望大家多多支持脚本之家。
相关文章
这篇文章主要介绍了vue 中使用 watch 出现了如下的报错信息的原因分析及解决方法，本文附有代码解决方案，非常不错,需要的朋友可以参考下2019-05-05
这篇文章主要介绍了Vue3文件拖拽上传功能,支持拖拽到此区域上传，支持选择多个文件/文件夹，代码很简单，对vue3拖拽上传功能感兴趣的朋友一起看看吧2022-10-10
这篇文章主要介绍了antd design table更改某行数据的样式操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-10-10
Vue.js框架是什么，为什么要选择它？这篇文章为大家介绍目前前端技术使用的趋势，以及Vue.js的优点和适用场景等，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-10-10
这篇文章主要介绍了vue设置默认首页的操作，具有很好的参考价值，希望对大家有所帮助。一起跟随小编过来看看吧2020-08-08
Vue中使用定时器(setInterval、setTimeout)的两种方式
js中定时器有两种，一个是循环执行 setInterval，另一个是定时执行 setTimeout，这篇文章主要介绍了Vue中使用定时器 （setInterval、setTimeout）的两种方式,需要的朋友可以参考下2023-03-03
这篇文章主要介绍了Vue进阶构造属性，从4个方面来进行讲解：Directive、Mixin 混入、Extends 继承、provide 和 inject，感兴趣的小伙伴们，赶快来看一下2021-05-05
这篇文章主要介绍了vue的路由映射问题及解决方案,文中通过示例代码介绍的非常详细，对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下2019-10-10
这篇文章主要为大家介绍了vue.js项目中使用原生js实现移动端的轮播图，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪2022-04-04
vue-tree-chart树形组件的实现(含鼠标右击事件)
Vue-Tree-Chart,一个Vue.js2组件，本文就详细的介绍一下vue-tree-chart树形组件的实现(含鼠标右击事件)，文中通过示例代码介绍的非常详细，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2022-02-02
最新评论