前言：在设计小程序的时候，难免有需要登录啊，访问数据库，交互等访问后台的数据，这时候，时间，往往不能控制，有时候网络并不稳定，这时候，我们做页面的设计的时候就必须考虑给出等待通知，定时，时间间隔的方法：

1 给用户等待通知延迟

1.1 通过显示Toast给用户等待通知

【中级】【后台】微信小程序 - 腾讯云 - wafer2 - PHP - DEMO - 003 - 源码分析 - 03 - 腾讯后台初始化和 CodeIgniter

微信Demo封装了消息通知Toast给用户，在demo中定义在，util.js里面：

// 显示繁忙提示
var showBusy = text => wx.showToast({title: text,icon: 'loading',duration: 10000
})// 显示成功提示
var showSuccess = text => wx.showToast({title: text,icon: 'success'
})// 一般错误提示
var showErr = text => wx.showToast({title: text,showCancel: false
})// 显示失败提示
var showModel = (title, content) => {wx.hideToast();wx.showModal({title,content: JSON.stringify(content),showCancel: false})
}module.exports = { formatTime, showBusy, showSuccess, showErr,showModel }

在js文件开始中，用require命令，加入上面的接口

var util = require('../../utils/util.js')

使用的时候，直接调用就好了，在一开始请求的时候，就把等待提示打印出来，在从服务器返回成功后，把等待通知换成成功的勾就好了。

效果如下：

1.2 一些组件也有给出客户等待通知的属性：

例如button 的loading

Boolean

false

名称前是否带 loading 图标

wxml里面的loading

<button type="default" size="{{defaultSize}}" loading="{{loading}}" plain="{{plain}}"disabled="{{disabled}}" bindtap="default" hover-class="other-button-hover"> default </button>

js下数据里面，

var pageObject = {data: {defaultSize: 'default',primarySize: 'default',warnSize: 'default',disabled: false,plain: false,loading: false},

1.3 loading 标签的使用：

前言：loading和wx.showToast的区别：

wx.showToast加载的时间长度是需要手动设置的，默认1500ms，而loading标签则可以配合数据加载进行隐藏。

核心就是在数据量较大或者网络情况较差，请使用loading，其他情况使用wx.showToast。

WXML：

JS：

初始化显示loading标签，等到数据从后台获取完毕，再进行隐藏即可。

效果：

2 实践等待，和定时：

上面给出的办法，只是，给出了需要等待的通知给用户，然后，实际上，我们必须实现一个真的等待函数，来等待来着服务器或者访问数据，信号不好的延迟。

2.1 settimeout和setinterval

在一个项目中用wx.request 去拿服务器上的数据userchk，拿完数据后，要根据服务器的返回值，来决定页面的跳转，

最开始的想法，是想在页面上，通过tag navigator来页面路由，但是，发现无论如何调试，button，

可是，按键button，bindtap的事件执行后，服务器的数据还没有回来，这时候，决定跳转必须等待服务器的数据处理完成，然后根据数据的值来跳转页面。

后来，决定改用js里面的控制语句进行页面跳转的办法，利用settimeout来在跳转前，先等待服务器返回的数据更新后，在跳转，这样就可以跳转到正确页面了：

      // Page navigatesetTimeout(function () {if (userchk == 'true') {util.showSuccess('请求成功完成');wx.switchTab({url: '../../../pages/notes2/pagenotes2'})} else {util.showErr('找不到此会员');} }, 200);},

参考：

1 微信小程序中如何使用loading组件显示载入动画

https://segmentfault.com/a/1190000008709046

2 微信小程序弹出loading层的两种方法

http://www.51xuediannao.com/xiaochengxu/111311I2016.html

3 【微信小程序】loading标签使用，可自定义时长

https://www.cnblogs.com/xuzhengzong/p/8035991.html

4 settimeout和setinterval

https://blog.csdn.net/xuexixuexien/article/details/79146659

非常好的一个间歇调用和timeout的比较方法：

https://www.cnblogs.com/lengyuehuahun/p/5650030.html

5 微信小程序带参传递的界面跳转的两种方式

https://blog.csdn.net/bright789/article/details/54729151

【小程序】【Tips】等待服务器的反馈的定时、间隔运行的正确方法相关推荐

微信小程序解决请求服务器手机预览请求不到数据的方法
微信小程序解决请求服务器手机预览请求不到数据的方法微信小程序的文档中明确说明了所有的请求是必须使用https的,以没用过https,由于小程序,不得不接触到https,研究了好长时间把tomcat ...
用什么服务器开发小程序,开发小程序用什么服务器系统
开发小程序用什么服务器系统内容精选换一换按照翻译方式的不同,高级语言通常可以分为两类:一类是编译翻译,一类是解释翻译,分别对应着编译型语言和解释型语言.编译型语言典型的如C.C++语言,都属于编 ...
小程序的服务器怎么与数据库连接,小程序怎么连接服务器数据库
小程序怎么连接服务器数据库内容精选换一换 "数据导出"章节适用于MRS 3.x及后续版本.Loader是实现MRS与关系型数据库.文件系统之间交换数据和文件的ETL工具,支持将 ...
小程序怎样和服务器交互,微信小程序与 Django服务器数据流交互通信
Django服务器解析小程序发送的json二进制字符串 https://blog.csdn.net/qq_25068917/article/details/81041048 http://www.c ...
java udp 服务器方_Java的UDP通信的小程序，UDP服务器
我一直工作在不同的方式来满2编码天做到这一点,我需要一些帮助:Java的UDP通信的小程序,UDP服务器我想在网上创建Java中的多人游戏.要做到这一点,我需要服务器和小应用程序之间的通信我的印象 ...
小程序登录本地服务器,微信小程序实现用户登录模块服务器搭建
我选用的是node.js来搭建服务器,没有安装的小伙伴可以参考我的node.js其他博客. 服务器安装与配置初始化项目,将会自动创建package.json配置文件. npm init -y 安装E ...
小程序访问本地服务器注意点
小程序访问本地服务器小程序连接本地服务器在这里设置下
微信小程序上传图片至服务器Springboot接收格式的问题
微信小程序上传图片至服务器Springboot 需求:通过微信小程序上传图片到服务器,保存至服务器. 实现 Wxml <button bindtap="choose"> ...
小程序服务器 win,微信小程序借用独立服务器即可事半功倍
原标题:微信小程序借用独立服务器即可事半功倍微信小程序近几年的比较火热,然后开发商都知道小程序是不能直接显示网页内容的,需要借用Windows独立服务器,小程序直接调用就能显示网页内容了. 说到Wi ...

【小程序】【Tips】等待服务器的反馈的定时、间隔运行的正确方法