小程序坑 redirectTo 计时器 setInterval clearInterval
var time = 20; var timer = setInterval(function () {
time = time - 1;
that.setData({
CountDown: time
});
console.log(time);
if (time == 10) {
clearInterval(timer );
wx.redirectTo({
url: './game',
});
}
}, 1000);
正常情况下页面刷新之后正在执行的计时器会被清除,可是在小程序当中并不是这样,即使执行了redirectTo关闭了当前页面到一个新页面,直到达到清除的条件之前(此例是time == 10),老页面的计时器仍旧不会被清除,仍旧继续执行。
网友通过将timer添加到data中,通过以下方法获得setInterval返回值,并在onload的时候清楚上一个页面的计时器,这种做法是错误的,因为此时的this已是一个新的页面,再通过this.data.timer的方法是获取不到上一个页面的计时器id的。每次开始打印的都是
start:10000是达不到启动页面就能清除上一个页面的计时器的效果的。
data: {
timer: 10000
},
onLoad: function(options) {
var that = this;
clearInterval(that.data.timer);
console.log("start:" + that.data.timer );
var time = 20;
that.data.timer = setInterval(function () {
time = time - 1;
that.setData({
CountDown: time
});
console.log(time);
if (time == 10) {
clearInterval(that.data.timer );
wx.redirectTo({
url: './game',
});
}
}, 1000);
console.log("end:" + that.data.timer);*/
}
解决方法:redirectTo提供了接口调用成功或完成之后的success、complete的回调方法,只要在这里写clearInterval就能在跳转之前清除设置的interval了,在这里为便于其他的函数也能获取到当前页面的计时器进行清除,我们仍旧将timer设置到data中
data: {
timer: 10000
},
onLoad: function(options) {
var that = this;
clearInterval(that.data.timer);
console.log("start:" + that.data.timer );
var time = 20;
that.data.timer = setInterval(function () {
time = time - 1;
that.setData({
CountDown: time
});
console.log(time);
if (time == 10) {
clearInterval(that.data.timer );
wx.redirectTo({
url: './game',
});
}
}, 1000);
console.log("end:" + that.data.timer);*/
}
小程序坑 redirectTo 计时器 setInterval clearInterval的更多相关文章
- 详解封装微信小程序组件及小程序坑(附带解决方案)
一.序 上一篇介绍了如何从零开发微信小程序,博客园审核变智障了,每次代码都不算篇幅,好好滴一篇原创,不到3分钟从首页移出来了.这篇介绍一下组件封装和我的踩坑历程. 二.封装微信小程序可复用组件 首先模 ...
- 微信小程序navigateTo /redirectTo/navigateBack 三者区别
navigateTo 不会将旧页面出栈: redirectTo 会将旧页面出栈,再将需要跳转到的页面入栈: navigateBack 则是将页面栈最后一个元素出栈,因此倒数第二个元素会成为最后一个元素 ...
- 微信小程序 功能函数 计时器
let lovetime = setInterval(function () { let str = '(' + n + ')' + '重新获取' that.setData({ getText2: s ...
- 小程序坑之 swiper组件
表现:swiper 内容 空白 原因:swiper组件的current值为n时,重新刷新页面,current值不变,当刷新后的swiper item的数量少于 n 时,swpier找不到对应的item ...
- 微信小程序-坑1-await-async
VM45:1 thirdScriptError sdk uncaught third Error regeneratorRuntime is not defined ReferenceError: r ...
- 微信小程序-坑,wxml里wx:if 判断 数字 是否在一个数组中。
<view wx:if="{{item.index}} in {{vote_list}}"> 已赞 <image src="/static/zan_y. ...
- 微信小程序开发 (资料汇总,谁还没被坑过?希望助你绕过一些坑)
最近帮人家做一个微信小程序,刚好想熟悉一下.由于牵扯到多用户使用系统,以及数据共享,所以自然架构选择了,客户端和服务器的方式. 后台服务器是windows server,后台程序是.Net WebA ...
- 原创+转发:微信小程序navigator、redirectTo、switchTab几种页面跳转方式
什么是事件? 事件是视图层到逻辑层的通讯方式. 事件可以将用户的行为反馈到逻辑层进行处理. 详解(以常见的tap点击事情为例) 模板.wxml代码: <view id="tapTest ...
- 微信小程序开发踩坑记
前言 微信小程序自去年公测以来,我司也申请了一个帐号开发,春节前后开始开发,现在终于告一个段落了.谨以此文记录下踩过的坑. 坑1:scroll-view与onPullDownRefresh冲突 由于有 ...
随机推荐
- shell2
例一:数组选择 #!/bin/sh menu=("Apple" "Grape" "Orange") PS3="喜欢哪个" ...
- ibatis 读写clob数据
ibatis 读写clob数据 CreationTime--2018年7月1日09点57分 Author:Marydon 1.从数据库读取数据 <!-- 根据主键查询患者信息.申请单.报告单 ...
- Android Shader 颜色、图像渲染 paint.setXfermode
Shader Shader是一个基类,表示在绘制期间颜色的水平跨度 它的子类被嵌入在Paint中使用,调用paint.setShader(shader). 除Bitmap外的其他对象,使用该Paint ...
- iOS仿支付宝首页的刷新布局效果
代码地址如下:http://www.demodashi.com/demo/12753.html XYAlipayRefreshDemo 运行效果 动画效果分析 1.UI需要变动,向上滑动的时候,顶部部 ...
- linux内核参数分析
这是原来在51cto写的,现在都转到博客园来了 1.time_wait连接数过多,需要调整内核参数 http://blog.renhao.org/2010/07/setup-linux-kernel- ...
- jsp页面JSTL标签 <c:fn:>
函数名 函数说明 使用举例 fn:contains 判断字符串是否包含另外一个字符串 <c:if test="${fn:contains(name, searchString)}&qu ...
- Android中多线程编程(三)Handler更新UI的方式
Handler更新UI的方式和原因以及遇到的问题 1.方式: 仅仅能通过Handler来更新UI. 代码例如以下: package com.chengdong.su.handlerdemo; impo ...
- 使用WebStorm将项目部署到IIS
在WebStorm中打开项目,通常WS会启动一个虚拟服务器并使用如下地址访问 但这样会有一个问题,在局域网内的其他设备,比如手机和其他电脑是不能访问这个地址的,这样就给开发和调试带来了不便.本人也是惭 ...
- HTML5 2D平台游戏开发#7Camera
在庞大的游戏世界中,玩家不能一览地图全貌,而是只能看到其中一部分,并一步步探索,这时就要用到一种技术来显示局部的地图,游戏术语称为摄像机(Camera).下面两张图中的白色矩形框表示了Camera的作 ...
- Debian NAT共享上网
如果Linux主机有两个网卡,比如一个有线.一个无线,当无线连接后,其他机器即可通过有线共享上网,为了方便叙述,假设环境如下: A机器有两块网卡,eth0和ws0,其中ws0为无线网卡,已连接wifi ...