首页 小程序开发 正文内容

uni-app 开发小程序如何实现延迟执行代码?

2023年08月21日 , 108

这篇文章分享我是如何在小程序、APP 开发中实现 sleep() 方法来延迟执行代码的。

这个功能实现其实非常简单,由于 uni-app 使用的是 javascript,小程序也是 js,所以就用 js 内置的 setTimeout 就可以了,再简单不过了:

setTimeout(function() {
  // 这里写要延时执行的代码
  // ...尽情地写 bug 吧...

}, 1000); // 这里的 1000 表示延时的时间,单位是毫秒

不过这是一个回调函数,如果要多次调用的话,不仅代码就会很乱,而且还很容易出现 js “回调地狱”,我比较喜欢用 async / await 来解决这个问题:

// 先封装一个 sleep 方法
const sleep = (time)=>{
  return new Promise(resolve=>{
    setTimeout(resolve, 1000);
  })
}

// 直接用 then 调用
sleep(1000).then(()=>{
  // 这里写要延时执行的代码
  // ...
})

// 或者在 async 里调用
async function doMe(){
  await sleep(1000);
  // 这里写要延时执行的代码
  // ...
}

doMe();

这样就可以非常优雅地调用 sleep() 方法来延迟执行了,代码很直观,从上到下执行,不容易出错。