如今有一个小程序,对页面数据的实时性很强,原本想用socket,仔细研究了一下,万剑不离其中,它是websocket。服务端不会用,因此使用了传统的http请求方式。开发微信小程序必需要知道的事html
1.请先看官方文档web
https://developers.weixin.qq.com/miniprogram/dev/framework/app-service/route.htmljson
说明:官方文档的路由触发方式对页面生命周期的影响。如图:小程序
在项目过程当中,服务端不开心的说,你怎么一直请求我,我服务都反应不过来快崩溃了。通过控制台仔细查看发现,只要打开过的小程序页面的定时器都在不间断的运行着,这是为何?微信小程序
后来研究发现,微信小程序为何会有页面生命周期这个概念,由于它和咱们传统的web浏览器切换页面的机制是不一样的。小程序的页面切换,是页面的显示和隐藏,只有没有启动过的页面才会进行初始化onLoad()。浏览器
明白了,页面跳转后,隐藏了页面,可是依而后台运行着。为了减轻服务端的请求压力,必须保证不展现页面的数据,中止刷新。具体操做请查看以下代码:微信
主要实如今js文件中websocket
var obj=wx.createSelectorQuery(); var config = require('../../config.js'); var app = getApp(); Page({ data: { timerTask:''//本页面的定时任务,要在这里声明定时器的变量名 ,title: '工做面' ,listRy: {'bianhao': '0','xingming': '0','dangqianquduan': '0','daodashike': '0','banci': '0','jibie': '0','bumen': '0'} ,listXz: [ {'bianh': '0','machineid': '0','detectorid': '0','xtime': '0','quduanming': '0'}, {'bianh': '0','machineid': '0','detectorid': '0','xtime': '0','quduanming': '0'}, {'bianh': '0','machineid': '0','detectorid': '0','xtime': '0','quduanming': '0'}, ] }, onReady:function(res) { // 页面初次渲染完成时触发。一个页面只会调用一次,表明页面已经准备稳当,能够和视图层进行交互。 }, onLoad: function (e) { var title = e.title var that = this wx.setNavigationBarTitle({ title: title }); }, onShow: function () { var that = this; var id = e.id //页面加载成功后,要先请求一次数据,不然会在定时时间到达时才会请求数据 search_data(that, id); //将定时器赋值给data中的timerTask变量,便于关闭定时器调用 that.setData({ timerTask: setInterval(function () { search_data(that, id); }, config.timeOut) }) }, onHide: function () { //写在onHide()中,切换页面或者切换底部菜单栏时关闭定时器。 clearInterval(this.data.timerTask); }, qiehuan_click: function(e) { this.setData({ select:e.target.dataset.num }) }, }) function search_data(that,id){ wx.request({ url: config.service.host , method: 'post' , data: {'query': 'gzm','bianh': id} , header: { 'content-type': 'application/x-www-form-urlencoded' // 默认值 } , dataType: 'json' , success: function (re) { console.log(re) if (re.statusCode==200){ //这里是成功后的操做 } } }) }
来源:https://blog.csdn.net/weixin_42799222/article/details/86528216app