js setTimeout 中怎么返回值

clipboard.png
由于DOM加载问题,需要异步后才能获取到DOM的属性, 但是我需要返回这个判断, 怎么写才能返回出去判断后的值;
代码如下,现在是不行的

 checkOver(item){
        let check = false;
          setTimeout(() => {
            check = $('#dept' + item.department_id)[0].offsetWidth < $('#dept' + item.department_id)[0].scrollWidth;
            return check;
          }, 1)
      }

回答:

在setTimeout中你是拿不到返回值的,你可以用Promise来wrap一下。

function checkOver(item) {
   let check = false;
   let promise = new Promise(function(resolve, reject) {
     setTimeout(() => {
       check = $('#dept' + item.department_id)[0].offsetWidth < $('#dept' + item.department_id)[0].scrollWidth;
       resolve(check);
     }, 1);
   });
   return promise;
}

checkOver(item).then((check) => {
  console.log(check); // --> true/false
});

回答:

异步返回不出去的
关于异步常用两种方式 callback和promise
callback回调:

checkOver(item,callback){
    let check = false;
    setTimeout(() => {
        check = $('#dept' + item.department_id)[0].offsetWidth < $('#dept' + item.department_id)[0].scrollWidth;
        callback&&callback(check)
    }, 1)
}
//调用
checkOver(item,function(check){
    console.log(check)
})

回答:

promise包装一下

回答:

callback回调或者用promise封装都是可以达到效果的。或者定义一个全局变量,赋值。不过这样没有前两个方案好。

回答:

setTimeout是异步运行的,返回不出去,可以用回调函数做自己想要的处理

回答:

DOM加载后执行 在mounted 或者 $nextTrick执行就好了 不需要用定时器吧

回答:

等等,你们说了这么多难道没想过用$(document).ready()

回答:

用promise或者async/await。

回答:

setTimeOut没有直接值的返回途径,你只能采用其他方法:

  1. 如果支持ES6/7 ,可以采用promise包装,直接处理为异步执行
  2. 如果不支持这些特性,你需要在setTimeOut的执行具体函数中去检查相关变量,自己通过回调,或者其他触发调用方式在函数执行中解决值同步问题。

不过看你语句,是支持新特性的,可能你需要清理一下你的思路,采用promise包装来进行了。

回答:

let s = '';
return new Promise((resolve, reject) => {
    setTimeout(() => {
        s = `
            <div class="mapStreet" ref="mapStreet">
                <div class="arraw"></div>
                <h1>${params.name}</h1>
                ${editFence}
                <div class="inner">
                    ${score}
                    <ul class="list">
                        ${str}
                    </ul>
                </div>
            </div>`;
        resolve(s);
    }, 800);
});

暂无评论

发表评论

您的电子邮箱地址不会被公开。 必填项已用*标注