倒计时n秒返回上一页或指定页面(定时器)

    技术2022-07-10  132

    **主要就是一个定时器3s之后返回上一页功能

    html**

    <view class="back">{{content}}s后自动跳转返回</view>

    **

    js

    **

    data(){ return{ content:3,//默认多少秒开始倒计时 } }, mounted() { this.jumpBack()// }, methods:{ jumpBack(){ var clock = setInterval(() => {//定时器开始 this.content=this.content-1; if (this.content < 1) {//当倒计时小于1秒后,就跳转到上一页 let pages = getCurrentPages(); //获取页面栈 //获取到返回的页面下标 let pageIndex = pages.findIndex((findItem)=>{ return findItem.route==='subPages/index/index' /* 需返回的页面路由 }) uni.navigateBack({//此处是用uni-app 写的,如果是vue中可以只用用路由跳转或者this.$router.go(-1)跳转到上一页或者this.$router.push('XX')跳转到指定页面 //此处uni-app写的跳转上一页也可以改成delta:-1 delta:(pages.length-(pageIndex+1)),animationType:'slide-out-right', }) clearInterval(clock)//清空定时器 } }, 1000) }

    效果图

    注:

    次功能主要就是一个定时器然后倒计时到0时跳转到上一页,或者指定页面。 此处我是用uni-app 写的到指定页面,如果是在vue 中跳转到上一页可以用this.$router.go(-1)或者直接路由到指定页面 (上面代码中有注释)

    Processed: 0.012, SQL: 9