js怎么在函数里使用settimeout后再执行下面的代码,必须把需要后执行的放到settimeout里面吗?

如下代码:当然是不行的。

const okPush=async ()=>{
  if(!data.dataForm.UserNo || !data.dataForm.UserName || !data.dataForm.RoleNo){
    ElMessage.error('登录账号、用户名、用户角色不能为空。')
    return false
  }
  if(data.addEditType==='addUser' && !data.dataForm.UserPassword){
    ElMessage.error('密码不能为空。')
    return false
  }
  console.log(data.addEditType)
  data.btnLoading=true;
 await  setTimeout(()=>{
      console.log('sss')
  },1000)
  const res=await accessApi[data.addEditType](data.dataForm).catch((e)=>{ElMessage.error(e);data.btnLoading=false;})
  if(res.Code===0){
    getUserData()
    data.dialogA=false
    data.btnLoading=false
  }else{
    ElMessage.error(res.Msg)
    data.btnLoading=false
  }
}

我想

await  setTimeout(()=>{
      console.log('sss')
  },1000)

执行完后再继续执行下面的,必须把后面的放到settimeout里面吗???

阅读 3.9k
5 个回答

有异步的意识,知道需要 await,这很好。关于意识,推荐阅读:异步编程需要“意识”

但是注意 setTimeout 返回的是一个整数(Node 下是一个对象),它并不能等到 setTimeout 执行完成。需要把 setTimeout 封装成 Promise,代码也不难,就如 @holyPotato 所写。关于 await,推荐阅读:理解 JavaScript 的 async/await

不过这个简单封装的 Promise 是不能取消的。在指定时间内想取消这个定时任务就做不到了,因为没有取消的入口。关于取消的问题,推荐阅读:javascript - 可以中断的异步操作。这篇文章里甚至有 setTimeout 的封装实现。

 await new Promise((resolve) => {
  setTimeout(() => {
      console.log('sss')
      resolve()
    }, 1000)
})
// 用promise模拟封装一个睡眠函数
function sleep (millsecond: number) {
  return new Promise(function (resolve) {
    setTimeout(resolve, millsecond)
  })
}

// 等待1000毫秒后,执行之后代码
await sleep(1000)

// 继续之后的代码
var a = []

确实如果按照你这样写的话,不行。具体原因看边城大佬的回复。

如果要做到可以配合 async/await 暂停,需要把 setTimeoutpromise 包裹起来,或者单独封装成 Bestime 提供的 sleep 方法。

这样才可以成功等到 setTimeout 执行完毕后再执行后续业务代码。
async/await 的暂停需要 await 等待的方法返回一个 promise。这个可以从文档里面看到。

可以去了解一下js单线程背景下出现的event loop执行机制。node也有专门的文档介绍。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
推荐问题
宣传栏