猿问

在承诺中解决承诺

我遇到了一个问题,我有一个本机反应应用程序,我有一组操作来显示视频(我之前记录了这些操作)。


我对所有动作都有一个 for 循环,需要等待视频达到某个时间戳才能触发动作。为此,我使用一个开关来识别我所有的动作,并在内部等待一个承诺,以便在好的时间戳触发动作。


这是我的代码:


  isTimestampReached = (timestampToWait) => {

    console.log(

      `timestampToWait: ', ${timestampToWait}, currentTime: ${this.videoPlayerRef.controlButtonRef.getCurrentTime()}`,

    );

    return new Promise((resolve, reject) => {

      if (

        timestampToWait <

          this.videoPlayerRef.controlButtonRef.getCurrentTime() + 0.05 &&

        timestampToWait >

          this.videoPlayerRef.controlButtonRef.getCurrentTime() - 0.05

      ) {

        console.log('timestamp Reached !');

        resolve(true);

      } else {

        setTimeout(this.isTimestampReached, 100, timestampToWait);

      }

    });

  };


  previewRecording = async () => {

    this.resetPlayer();

    const {recordedActions} = this.state;

    console.log('recordedActions: ', recordedActions);

    for (const action of recordedActions) {

      console.log('action', action);

      switch (action.type) {

        case 'play':

          console.log('launch play');

          // if (await this.isTimestampReached(action.timestamp)) {  // this is the same as the line under

          await this.isTimestampReached(action.timestamp).then(() => {

            this.videoPlayerRef.setState({

              paused: false,

            });

            console.log('setPlay');

          });

          break;

        case 'pause':

          console.log('launch pause');

          await this.isTimestampReached(action.timestamp).then(() => {

            console.log('set Pause');

            this.videoPlayerRef.setState({

              paused: true,

            });

          }),

      }

    }

  };

和日志:

我们可以看到我待在和里面for loopswitch因为我没有得到console.log('pause outside loop');。但正如你所看到的,我也不明白console.log('set Pause');。所以这意味着我的承诺没有解决。

我认为问题在于在承诺中启动承诺,因为对于第一种情况(播放)它直接起作用。但我不知道如何解决这个问题。

预先感谢社区

PS:我只放了 javascript 标签,因为我认为这与 react 或 react-native 无关。


墨色风雨
浏览 78回答 2
2回答

慕桂英546537

这意味着我的 Promise 没有解决。我认为问题在于在承诺中发起承诺。的确。在 的执行者回调中new Promise,您只调用setTimeout但从不调用resolve()or reject()。100 毫秒后的isTimestampReached调用确实创建并返回了自己的承诺,原始的“外部”承诺从未得到解决。你可以通过做来解决这个问题setTimeout(() => {&nbsp; resolve(this.isTimestampReached(timestampToWait);}, 100);但是使用async/await进行轮询要容易得多:async isTimestampReached(timestampToWait) {&nbsp; while (true) {&nbsp; &nbsp; const currentTime = this.videoPlayerRef.controlButtonRef.getCurrentTime();&nbsp; &nbsp; console.log(`timestampToWait: ${timestampToWait}, currentTime: ${currentTime}`);&nbsp; &nbsp; if (timestampToWait < currentTime + 0.05 &&&nbsp; &nbsp; &nbsp; &nbsp; timestampToWait > currentTime - 0.05) {&nbsp; &nbsp; &nbsp; console.log('timestamp Reached !');&nbsp; &nbsp; &nbsp; return true;&nbsp; &nbsp; }&nbsp; &nbsp; await new Promise(resolve => {&nbsp; &nbsp; &nbsp; setTimeout(resolve, 100);&nbsp; &nbsp; });&nbsp; }}(您可以重构它以使用更好的循环条件,但您明白了)。

呼啦一阵风

&nbsp; await this.isTimestampReached(action.timestamp).then(() => {then 不会被执行,因为你等待使用以下const res =&nbsp; &nbsp;await this.isTimestampReached(action.timestamp)&nbsp; this.videoPlayerRef.setState({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; paused: false,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log('setPlay');或删除等待&nbsp;this.isTimestampReached(action.timestamp).then(() => {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.videoPlayerRef.setState({&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; paused: false,&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; console.log('setPlay');&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; });
随时随地看视频慕课网APP

相关分类

JavaScript
我要回答