竞争条件:在加载React之前尝试播放视频

Question

我正在使用ReactJS中的视频播放器.基本上,我已经设置了一个基于cookie的介绍视频,它是可以跳过的.当它被跳过时,我希望我的主视频自动开始播放.我这样做的方式看起来像这样(问题在于setTimeout()部分,我知道这没有意义)

  skipIntro() {
    if (this.state.index === 0) {
        this.handleVisit(MAX_COOKIES_INTRO);
        this.setState({
            index: ++this.state.index,
        });
        this.videoRef.updatePlaybackTime(0);
        setTimeout(() => {
                            this.videoRef.play();
                          }, 0);
    }
}

如果我不使用setTimeout,this.videoRef.play();则不执行.起初我以为是因为它是在主视频有时间加载之前被异步调用的.因为我等了0ms,我很困惑.为什么这样做？如果没有setTimeout调用,我真的更喜欢这样做.

Answer 1

setTimeout有点欺骗,因为它不会在它的时间后立即执行,而是在超时后将函数添加到队列中.在0ms的情况下,它立即将其添加到当前队列,而不是立即执行.

这并不一定意味着它会立即执行,而是将函数添加到队列中,其他调用可能正在等待执行.没有超时,它可能在需要进行任何其他调用之前执行.有关更多信息,请参阅此MDN页面.

在您的情况下,这可能意味着当您不setTimeout使用时setTimeout,主视频播放所需的内容未完成,但在使用时,您仍在延迟执行.

您还可以查看以下任一StackOverflow帖子:

设置为0毫秒时setTimeout的作用是什么？

为什么setTimeout(fn,0)有时会有用？