The use of timers in uni-app

learning target:

学习目标如下所示:

  • The timer function is implemented in uniapp by using the timer API provided by uni-app.

Learning Content:

内容如下所示:
**uni-app's timer API is divided into two types:
1. The first method:
setTimeout function, which is used to set a timer and execute the callback function after a specified time;

//示例如下所示:
setTimeout(function() {
									uni.navigateBack();
								}, 2000);
  1. The second way:
    the setInterval function is used to set a timer and execute the callback function repeatedly after a specified time interval.
//示例如下所示:
let clearInt = setInterval(()=>{
					this.percent ++;
				},30)
  1. The first way to cancel the timer:
    clearTimeout(timeoutID)
//示例如下所示:
onLoad() {
	if(this.timer) {  
		clearTimeout(this.timer);  
		this.timer = null;  
	}  
}
  1. The second way to cancel the timer:
    clearInterval(intervalID)
//示例如下所示:
	if(this.percent === 100){
						clearInterval(clearInt)
					//	that.allInventory()
					}
//示例如下所示:
stopScan() {
			    // 清除定时器
			    clearInterval(this.interval);
			    uni.showToast({
			        title: '关闭扫描成功',
			    })
			},

**


Summarize:

知识小结:

  • 1. Timer: setTimeout();//Execute once after n milliseconds
    The setTimeout() method is used to call a function or calculate an expression after a specified number of milliseconds.
    The setTimeout method receives two parameters, the first parameter is the callback function or string, and the second parameter is the trigger time (unit: milliseconds)
  • 2. Timer: setInterval();//Execute once every n seconds.
    The setInterval() method can call functions or calculate expressions according to the specified period (in milliseconds).

The setInterval() method will keep calling the function until clearInterval() is called or the window is closed. The ID value returned by setInterval() can be used as an argument to the clearInterval() method.

  • 3. Clear timer method: setTimeout() corresponds to clearTimeout(id);
  • 4. Clear timer method: setInterval() corresponds to clearInterval(id);
  • 5. Try not to use setInterval()
  • reason:
  • (1) setInterval() ignores code errors

setInterval is indifferent to whether the code it calls reports an error. If the code executed by setInterval fails for some reason, it will keep calling that code.

  • (2) setInterval ignores network delay

If you poll the server through Ajax every once in a while to see if there is any new data (note: it is better to use "backoff polling"). In actual use, due to some reasons (server overload, temporary network disconnection, sudden increase in traffic, limited user bandwidth, etc.), the request will take much longer than you think.
But setInterval will continue to trigger requests at regular intervals, and eventually the client network queue will be filled with Ajax calls.

  • (3) setInterval does not guarantee execution

Some calls will be ignored directly. Unlike setTimeout, you can't guarantee that the code will be executed when the time interval is reached.

  • 6**, the difference between settimeout and setinterval**

The setTimeout() method is used to call a function or calculate an expression after a specified number of milliseconds, that is, setTimeout() is only executed once. setInterval()
can call a function or expression cyclically every specified number of milliseconds until clearInterval clears it . That is, setInterval() can be executed multiple times.

  • 7. The same point
    The parameters of the two functions are the same, the first parameter is the code or handle to be executed, and the second is the number of milliseconds to delay.

  • 8. Differences in business scenarios and usage scenarios
    (1) setTimeout is used to delay the execution of a method or function.

(2) setInterval is generally used to refresh the form, and for some false real-time specified time refresh synchronization of some forms.

Guess you like

Origin blog.csdn.net/YHLSunshine/article/details/131902654